Highslide for WordPress *reloaded*

Welcome to Highslide for WordPress *reloaded*,
my intention behind this plugin was not to upload a additional highslide image popup plugin in the WP extension lib. There are quite many of them already present but I tested all and none of theme gave me all possibilities. Because I had done another successful HS Plugin for the CMS Joomla already I took my experience I made and created the “Highslide 4 WordPress *reloaded*”

Features ?

In Short terms: This Plugin automatically insert Highslide Script to your Blog without the need of any further configuration, Shorttags or editing of old posts. But on the other hand, if you want to change something you just can do it without “hacking” HTML or PHP Files by yourself. You have access to all Highslide options. Additional to this the Plugin offers support of the Highslide HTML Expanders. I am a example expander

Summarized:

• Including latest Highslide Scripts no need to seperate downloads or updates
• Optimized and JS packed for good pagespeed
• Optimized HS Graphics, save some bandwidth compared to the original
• Possibility to use Highslide HTML Expands
• Easy configuration
• Advanced setup possible
• optimized to pagespeed and yslow rulesets
• integrated Coralize CDN support
• Highslide Gallery enabled

Examples.

Image Expander

Click to Expand

Need Help ?

In this Part I try to answer some frequently asked questions and give a short introduction how to install and use the Plugin. If you still have questions or suggestions please visit the Plugin Forum.

1. Installation

Install the Plugin like every other WordPress plugin. You have two options:

A) use the buildin wordpress Autoinstaller. Goto Plugins -> Add New -> Search by Term: “Highslide 4 WordPress *reloaded*” and choose install.

B) manually download the plugin, extract it and place the directory “highslide-4-wordpress-reloaded” as a subdirectory into your wordpress plugin directory. Usually: “/wordpress/wp-content/plugins/“

After this first Step is done you have to Activate the Plugin and check the Pluginsettings. “Settings -> Highslide 4 WordPress” at this point it is necessary to accept the license. Without accepting it the Plugin is in a disabled state.

2. Settings

In this Section I list the possible Settings and try to describe what they do.

General Options

Use Coral CDN as JS/CSS source
By enabling this checkbox the JS and CSS files of highslide are served from the CoralCDN, this reduce the used bandwidth at your server and may speedup the loading time. (Depending in which Country you live) Just give it a try. More Info about the free Coral CDN: here.

Enable Fade In/Out transition in Galleries ?
This Option add a fading effect to the regular expand/contract effect. detailed Info

Disable Highslide Credits ?
Disable the credit overlay of Highslide.

Disable Highslide on Attachment Images ?
If you enable this the plugin ignores images posted as attachment into your post. This is useful to link images e.g. for direct download.

Align expanded images to center ?
The expanded images is aligned to the center of the page.

Add ext. Icon to [highslide]*[/highslide] Links ?
This adds this little Icon ““  in front of HTML Expander links.

Handle SWF files auto. as Object in HTML Expander ?
If this Option is enabled you can use the highslide expander to display flash files. Just specify a SWF URL in the expander.

[highslide]http://test.test/test/test.swf[/highslide]

the expanded SWF will automatically wrapped by a Flash Object code. The Plugin identify the SWF by checking the last 4 characters if they match to “.swf” (cans insensitive) the plugin handle the flash file. Time to time it is possible that a SWF url need to pass parameters like test.swf?get=3234&video=bcd in this case just add another get parameter: test.swf?get=3234&video=bcd&swf=test.swf

Slideshow delay:
This one specify the delay in seconds if you start a slideshow.

HS appearance:
Select and try. You can choose of different pre defined expander styles. Just what you like. If you select “use own definitions in Advanced section” the plugin does not insert any formating code you have to do this by your own in the textarea box at the advanced option dialogue.

Dimming opacity:
Should the webpage in the background get dimmed while viewing the expanded image ? At this option you can select the opacity of the dimming feature.

Heading source:
Select what part of the Image information should displayed as a heading on the expanded image or choose none for no heading. Currently it’s not possible to use the Wordpres “caption” with JS I can just query the image attributes like Title and Alt.

Caption source:
Select what part of the Image information should displayed as a caption on the expanded image or choose none for no caption. Currently it’s not possible to use the Wordpres “caption” with JS I can just query the image attributes like Title and Alt.

Advanced Options

Force Include of JS Code into Page Header instead of Footer.
By default the plugin includes the JS files at the end of the page into the footer. This is recommended behavior by google Pagespeed or Yahoos YSlow. Normally this is fine, but some Themes may not accept this and the plugin does not load completely. In this case turn on this Feature and the JS is included in the page header instead of the footer.

Enable </p> workaround.
On some WP installations I noticed that the HTML Expander [highslide] shows strange line break behavior. If you using multiple HTML Expanders on one page as a listing you maybe have to enable this. Please read this Forum Post for more information explaining in detail what this checkbox does.

Disable the Highslide Media Icon.
Since 1.14 this Plugin insert a small Media Icon into the WP-WYSIWYG Editor, by checking this option you can disable this icon.

Use custom highslide.css ?
Some blogs use their own custom CSS files. If you want to edit the highslide CSS files to better fit your page design it is not very effective to change the original CSS files coming with this plugin. Why ? Because each time you update the plugin your changes have to be redone. This Textbox give you the possibility to create a copy of the default highslide.css file and specify it. Now the specified CSS file will be loaded instead the default one. Please enter full URL. (Leave empty for default) e.g.: http://mydomain.com/myhighslide.css

Custom Highslide Config:
This is for the advanced user who want to customize highslide. Get sure to enter only valid JavaScript code into this Area, if not you can break the functionality of your webpage. More information of possible Settings: here.

Multisite Support

Some HS4WP Users asked me to integrate a full WordPress Multipage support. Well, this section is kind of. I’m never worked with WPMU for myself so its hard to get a full understanding of the different API functions. Also not every function is as well documented as it should. So please see this part currently just as a experimental enhanced workaround.

How does it work ?

Well you only see this Section if you are in a level of a Networkadmin, normal site admins just see the default HS4WP settings without this part. This feature works as a Options Fallback, if you once setup a default set by checking the Multisite checkbox it will be stored in the database as “network default” as long as you re-set it. If a Network site doesn’t have its own setup done it will fallback to the stored network default set. If a Site admin now change something at his own subsite plugin settings the changed settings will be priorized.

Conclusion: site related setup = primary, Network default set = secondary.

Just that simple :)

Using the HTML Expander

The Plugin offers the possibility to use the Highlside HTML Expander to display additional Information. (Example) You can insert a Expander by clicking the small Highslide Expander Icon in the WYSIWYG Editor or by inserting the syntax manually.
Syntax:

[highslide](Title;Link Name;Width;Height)Your content[/highslide]

Options:

Title: This will be the Caption of your Expanded HTML Window
Link Name: This is the Link text of the expander
Width: Width in pixel
Height: Height in pixel

Example:

[highslide](This is my Expander;Click to Expand;640;480)This is my Text, I can also specify HTML Code or insert images or other Media![/highslide]

This will look like this: Click to Expand

Download

Due to a license problem wordpress.org removed this plugin from the official repository. They dont like Creative Commins *sigh* and asked me to remove all code parts released within a “creative commons” license wich would be 90% of the plugin. So it’s unlikly to see it back on wordpress.org I sent in several emails to ask for alternatives but they just didn’t replied. A post in the official wordpress.org developer forum is still unheared too. So shame on wordpress.org.

Of course I will continue to support this plugin you can download it directly from my page. Due to the fact that with the removal from the official repository the auto update feature isn’t working anymore please check this page time to time if there is an update: