Hi!

I need to integrate this Popup Box Module Pro extension to the pavilion theme.
(http://www.opencart.com/index.php?route=extension/extension/info&extension_id=20378)

I’ve tried to add it throug the layout in tb_widgets and i can see the popup but not hidden. The instructions of the developer are this:

#=========================================================
# Popup Box Module Pro – OpenCart
# Installation Instructions
#=========================================================

CONTENTS OF THIS FILE
———————

* INSTALLATION
* CREATE A DEFAULT TEMPLATE FOR YOUR OPENCART THEME
* CREATE A DEFAULT STYLE SHEET FOR YOUR OPENCART THEME
* HOW TO CREATE A CUSTOM SKIN FOR YOUR POP-UPS WITH MINIMAL CODING REQUIRED

INSTALLATION
————

1. Unzip and upload the contents to the root directory of your OpenCart
installation, preserving directory structure. No files are overwritten.

2. From the admin menu, go to Extensions > Modules. Install the module, and
click edit to configure.

3. After you have installed and configured a module, navigate to Design > Layouts
to add it to a layout.

As for this module, it doesn’t matter what position you assign it to. You can
just set it to the “Content bottom” position unless you have a specific reason
to use the other ones.

4. Go to the frontend of your store to see the output.

CREATE A DEFAULT TEMPLATE FOR YOUR OPENCART THEME
———————————————

Copy popup_box.tpl in
catalog/view/theme/default/template/module/
TO
catalog/view/theme/[YOUR THEME]/template/module/

Then edit whatever you want.

CREATE A DEFAULT STYLE SHEET FOR YOUR OPENCART THEME
———————————————

Copy popup_box.css in
catalog/view/theme/default/stylesheet/
TO
catalog/view/theme/[YOUR THEME]/stylesheet/

Then edit whatever you want.

HOW TO CREATE A CUSTOM SKIN FOR YOUR POP-UPS WITH MINIMAL CODING REQUIRED
———————————————

You want to add your own pop-up but you don’t want to look tacky by using an
existing design. Creating your own skin can be daunting, but with some assistance
you can have a unique design for your pop-ups in no time. This will help you put
it all together using Popup Box Module Pro.

1. Create a new CSS file for your own skin.

You can create the CSS file from scratch, but it is recommended that you
just copy an existing file and rename it what you want your skin to be called.
Make sure the filename only contains small letters(a-z), numbers(0-9), and
dashes(-) with no blank spaces or special characters.

Let’s say we have an existing file named “simple-white.css”, we can simply
copy and rename it to create a new file named “my-skin.css”:

COPY:
catalog/view/theme/default/stylesheet/popup_box/skins/simple-white.css
TO:
catalog/view/theme/default/stylesheet/popup_box/skins/my-skin.css

2. Edit the .css file and replace the class name.

Then edit the file (my-skin.css) using a text editor on your computer (such
as Notepad, Wordpad, or Simple Text) and replace the following CSS class name
with a new one.

REPLACE
.popup-box-skin-simple-white
WITH
.popup-box-skin-my-skin.css

3. Design your own skin.

Now think about how you want it to look and try to use CSS to make your skin
look that way.

• This reply was modified 3275 days ago by  Rodrigo.