Fri
Feb 12 2010
10:49 am

We have a new "shadowbox" feature that lets you include a larger size pop-up image with your photos. Instructions follow...

1. Save the "front page" version of your photo with a width not exceeding 500px.

2. Save a second "large" version of your photo, recommended max width of 1024px.

3. Create a new post, attach the two image files.

4. In the body of the post, embed an image tag for the "front page" 500px max size photo like this:

<img src="/files/myphoto_sm.jpg">

5. Wrap the image tag with a link to the larger size photo using the special keyword 'rel="shadowbox"' like this:

<a href="/files/myphoto_lg.jpg" rel="shadowbox"><img src="/files/myphoto_sm.jpg"></a>

That's it. Clicking on front page photo will open a pop up with the larger version.

P.S. Note that you can just upload the large version if you want, and use it as the front page small photo with the 'width' attribute, like this:

<a href="/files/myphoto_lg.jpg" rel="shadowbox"><img src="/files/myphoto_lg.jpg" width="500"></a>

The disadvantage is that the browser does the resizing, and the image quality will probably not be as good as your photo software.

You can also create a gallery:

1. Follow the steps above to create the first photo in the gallery, i.e. the one that will show on the "front page."

2. Modify the 'rel="shadowbox"' tag to include a gallery name in brackets, for example 'rel="shadowbox[vacation]", like this:

<a href="/files/myphoto_lg.jpg" rel="shadowbox[vacation]"><img src="/files/myphoto_sm.jpg"></a>

3. Attach additional large size photos for your gallery.

4. Create empty link references for each photo referencing the same gallery name in the "shadowbox" tag, like this:

<a href="/files/myphoto2_lg.jpg" rel="shadowbox[vacation]"></a>
<a href="/files/myphoto3_lg.jpg" rel="shadowbox[vacation]"></a>
<a href="/files/myphoto4_lg.jpg" rel="shadowbox[vacation]"></a>
etc.

(Note: You may need to remove line breaks at the end of each link reference so they all run together in one big paragraph.)

An example (click image to start slideshow):


Topics:

TN Progressive

TN Politics

Knox TN Today

Local TV News

News Sentinel

    State News

    Wire Reports

    Lost Medicaid Funding

    To date, the failure to expand Medicaid/TennCare has cost the State of Tennessee ? in lost federal funding. (Source)

    Search and Archives