Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Superbox (as Lightbox modal window) Integration - how to
#1
If you like to integrate modal windows on a "Get Simple" way, may be it helps

Superbox is a modal window (as Lightbox) that comes with GS back-end.
Is lightweight and works with jquery.
So, that's good reason enough to use Superbox in place of any other modal window.

HOW TO ?
*1* Creating a Template file that calls the javascript and style files that make superbox work.
1) Go to THEMES/(template-folder)/ and copy template.php in a new file like superbox.php
2) Edit that file and Add code to link core JS and CSS superbox files already included in the ADMIN
Code:
<HEAD>
...
    <!-- JS Files -->
<script type="text/javascript" src="admin/template/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="admin/template/js/jquery.getsimple.js"></script>
<script type="text/javascript" src="admin/template/js/superbox/jquery.superbox.js"></script>
    <!-- CSS Stylesheets -->
    <link rel="stylesheet" type="text/css" href="admin/template/js/superbox/jquery.superbox.css" media="screen" />

*2* Modify TinyMCE to add attributes to link using superbox
Go to
admin\template\js\tiny_mce\plugins\advlink\
and edit the file
link.htm (I attach a already modified copy to make things easyer)

on row #198, You will find the dropdown list of attributes for advanced link tab (of create link button)
In order to allow the different options of superbox (more info at superbox creator's http://www.pierrebertet.net/projects/jquery_superbox/ ) you have to add the lines 4 to 8 from below code.
Code:
<td><label id="rellabel" for="rel">{#advlink_dlg.rel}</label></td>
<td><select id="rel" name="rel">
<option value="">{#not_set}</option>
<option value="superbox[image]">Superbox.img</option>
<option value="superbox[gallery][gallery_a]">Superbox.gelleri_A</option>
<option value="superbox[gallery][gallery_b]">Superbox.gelleri_B</option>
<option value="superbox[iframe][700x500]">Superbox.iFrame</option>
<option value="superbox[content]">Superbox.Content</option>
<option value="lightbox">Lightbox</option>

*3* Compose/Create your final page
On GS Admin -> Create Page -> Page Options -> Template -> choose superbox.php (created on above point 1)

Select an element (ie an image), click on LINK button, Advanced Tab, and into Relationship page to target, select superbox.img -> update

that's all folks =)
You can try options for gallery.A , or even 2 gallerys togheter.
Superbox.Iframe you can link URLS into the modal window.

andaluzian regards !
Reply


Messages In This Thread
Superbox (as Lightbox modal window) Integration - how to - by focoves - 2009-12-13, 08:03:07



Users browsing this thread: 1 Guest(s)