Suggested improvements to "gallery"
-
Thanks everyone for your suggestions/advice. I’m still not “average” but moving in the right direction…
Here’s that HTML code again (converted to be post-friendlyby plus2net web site – so good). Remember that this is the code you use for each page (one page is required for each image in your gallery – OMG this is a lot of work).
<div class="navigation">
<div class="cust-nav-previous">↑ Exit</div>
<div class="cust-nav-next">←Previous | Next→</div>
</div>
<div id="post-262" class="post-262 attachment type-attachment status-inherit hentry">
<div class="entry-content">
<div class="entry-attachment">
<p class="attachment"><img class="attachment-900×900" title="%THIS-CAPTION%" src="%THIS-IMAGEFILE%.jpg?w=%THIS-ADJ-WIDTH%" alt="%THIS-ALT-CAPTION%" width="%THIS-ADJ-WIDTH%" height="%THIS-ADJ-HEIGHT%" /></p>
<div id="nav-below" class="navigation">
<div class="cust-nav-previous">↑ Exit</div>
<div class="cust-nav-next">←Previous | Next→</div>
-
</div>
<div class="entry-caption"><p>%THIS-CAPTION%</p></div>
%THIS DESCRIPTION%
</div>
</div>
</div><div id="nav-below" class="navigation">
<div class="cust-nav-next">View full-size image %THIS-FULL-WIDTH% x %THIS-FULL-HEIGHT% pixels published %THIS-PUBL-DATE% by %THIS-PUBL-AUTHNAME%</div>
</div>
</div>Now here is the meaning of all those percentage variables.
What follows is a sample and the meaning of all those variables I encased in percent signs.
What follows might make more sense if you imagine you are editing page 10 in the gallery series.
———————————————————————————–
%EXIT-PAGE%
Sample:
http://myblog.wordpress.com/my-gallery-entry-page/Meaning: The link to the page that you edited in Step 1.
———————————————————————————–
%PREV-CAPTION%
Sample:
My Beautiful Image 9Meaning: Title for Previous link: the caption of the image on the "Previous" page in the gallery.
On the first page in the gallery I suggest you use "Exit".
———————————————————————————–
%PREV-HREF%
Sample:
http://myblog.wordpress.com/sw-image9Meaning: The link to the "Previous" page in the gallery.
———————————————————————————–
%NEXT-CAPTION%
Sample:
My Beautiful Image 11Meaning: Title for Next link: the caption of the image on the "Next" page in the gallery.
(Use the word "Finish" on the last page in the gallery series.)
———————————————————————————–
%NEXT-HREF%
Sample:
http://myblog.wordpress.com/sw-image9Meaning: The link to the "Next" page in the gallery.
———————————————————————————–
%THIS-CAPTION%
Sample:
My Beautiful Image 10Meaning: The caption of the image that is being displayed on "This" page.
———————————————————————————–
%THIS-IMAGEFILE%
Sample:
http://myblog.wordpress.com/xxxx/my-beautiful-image10Meaning: The name of the jpg file containing the image for "This" page.
———————————————————————————–
%THIS-ADJ-WIDTH%
Sample:
642Meaning: Tricky stuff. This is an adjusted width (in pixels) of the image being displayed
on "This" page. It is a calculated figure. The full-size image is shrunk down to fit inside 900 x 900 space.
(Note: This applies to my theme. Your theme may be different.) To fit into this box, the full size
width and/or height are adjusted downward to retain the proportions of the image.
I found these numbers in the source code of the original permalink file created by the old [gallery] command.
———————————————————————————–
%THIS-ALT-CAPTION%
Sample:
My Beautiful Image 10Meaning: This is the "Alt" caption (before image is displayed) of the image being displayed on "This" page.
———————————————————————————–
%THIS-ADJ-HEIGHT%
Sample:
642Meaning: Tricky stuff. This is an adjusted height (in pixels) of the image on "This" page. Refer to %THIS-ADJ-WIDTH% for explanation.
———————————————————————————–
%THIS DESCRIPTION%
Sample:
Hey there sport fans. This product is my favorite. I use it every day. Only $9.95 + postage for a dozen.Meaning: Any number of lines of text that come from the Description of "This" image. I’d expect it to correspond to the Description you
loaded against the image in your Library but it doesn’t have to be the same.
———————————————————————————–
%THIS-FULL-WIDTH%
Sample:
1024Meaning: The width (in pixels) of the full-size image on "This" page.
Can be obtained by viewing the top of the permalink page.
———————————————————————————–
%THIS-FULL-HEIGHT%
Sample: 768Meaning: The height (in pixels) of the full-size image on "This" page.
Can be obtained by viewing the top of the permalink page.
———————————————————————————–
%THIS-PUBL-DATE%
Sample:
20Sep2011Meaning: The date you published the full-size image on "This" page.
Can be obtained by viewing the top of the permalink page.
———————————————————————————–
%THIS-PUBL-AUTHNAME%
Sample:
Arthur C ClarkMeaning: Name of the author who published the full-size image on "This" page.
Can be obtained by viewing the top of the permalink page.Step 4: Adjust the Links on the Lead In page
In Step 1 you created a new lead-in page that bypassed the carousel. This page contains links against each image (href) to the old permalink page. You need to edit this page and change each link to point to your newly created pages from Step 3.That’s it. Phew! Not sure if anyone will be able to follow all this gruesome detail. Happy to field questions/suggestions/simplifications. Someone’s already noticed that Step 1 doesn’t work with all the themes.
Good luck.
-
Hmmm. That plus2net didn’t work. I’d recommend using the link to textsnip to view the HTML code.
-
-
@Ros: Sorry if I misled you. You wrote “I tried to paste the HTML code for Step 3 into a post“. That’s why I suggested the plus2net tool: for your blog, not for the forum.
- The topic ‘Suggested improvements to "gallery"’ is closed to new replies.
WordPress.com Forums 
