image title using as caption

classic Classic list List threaded Threaded
5 messages Options
Reply | Threaded
Open this post in threaded view
|

image title using as caption

j-c-r-w
Hi,
i'm a newbie to ShadowBox but already a fan. Is the best ImagePopup I know and it's free.

Since I use Wordpress for a client and don't want him to get an expert in HTML, I would appreciate 2 things:

1. Is it possible for Images that are shown in SB to show their title attribute as a caption so the user doesn't have to manipulate the link?

2. Is it possible to tell SB to open automatically all images in the content-area that are included in an anchor, so the user doesn't have to insert the rel manually?

I saw a script like SB that did it, and as an extra feature, it got all images that where in one article as a gallerry. That would be the best.

Any suggestions I can realize that?

Thanks
Reply | Threaded
Open this post in threaded view
|

Re: image title using as caption

Wizzud
There is a shadowbox plugin for wordpress. Are you trying to write your own?
1. http://mjijackson.com/shadowbox/doc/usage.html#markup
2. http://mjijackson.com/shadowbox/doc/usage.html#parameters
Combine literacy with curiosity and a whole world of information opens up to you
Reply | Threaded
Open this post in threaded view
|

Re: image title using as caption

j-c-r-w
Thanks for answering so fast.
No no, i'm not writing one by myself.

If I could to this, i probably could change the code for my belongings by myself.

I do have the Wordpress Plugin and it works all perfect, but as a matter of fact not automatically. Of course I can add manually a rel-attribute to each picture, but it is not very comfortable. Plus, I do have about 70 posts with images already and would have to change them all to get SB working on them.

If it would be able to add the rel="shadowbox" autmatically to all anchors with images in it, would it also be possible to add rel="shadowbox[post_ID]" to show images of a post as an imageset?
I saw this on a script, don't know which one it was. But the script didn't look that good and didn't resize pictures that were bigger than screen. (Try to get you the name of the script later).

Also the Caption is a problem in Wordpress. Most scripts take the title attribute of the image for the caption, not the title of the anchor. SB does not. Or can I configure that?
Reply | Threaded
Open this post in threaded view
|

Re: image title using as caption

Wizzud
Ok, so it sounds like you want to modify the behaviour of the wordpress plugin.

First off, I am not a wordpress expert, so I can't provide code changes - you probably need to look at the forum/comments of the author of the wordpress plugin.

What you want to do is certainly possible...

Run Shadowbox.init() with skipSetup:true
Use the relevant library to...
- get all links containing images, restricted to the context of the POST
- for each relevant link found, run Shadowbox.setup(link, {options}), setting title in the options to be the title attribute of the contained image, and gallery to the POST id (you may need to set up other options as well - I don't know)

An alternative:

Use the relevant library to...
- get all links containing images, restricted to the context of the POST
- for each relevant link found, set it's rel attribute to 'shadowbox[POST id]', and it's title attribute to the title of the contained image
Run shadowbox.init()

In either case, you need some way to determine the POST id, or some other means to set a string that is unique to each POST. And, of course, if you have more than one POST visible on any page then you need to repeat the "Use the relevant library to..." bits for each POST.

The second method is more intrusive because it actually modifies the links on the page, whereas the first does not.

A last alternative is to modify shadowbox.js itself, but this could well leave you with more problems than you started with. You'd have to allow titles of shadowboxed images (if present) to override the default title, and you'd have to construct another - or additional - method for auto-scanning the document for suitable links (other than simply looking for anchors with a defined rel atribute). It could easily break shadowbox.js for standard usage, and would make upgrading difficult.

NOTE : All the above is assuming a javascript solution. Wordpress is PHP so if there is a PHP solution that can provide all the correct links to start with then none of the above need be necessary!
Combine literacy with curiosity and a whole world of information opens up to you
Reply | Threaded
Open this post in threaded view
|

Re: image title using as caption

j-c-r-w
Hi,
thanks a lot for your answer.
I got the link problem working with a modification of shadowbox itself.
I included the followong code:
<code>
/**
 * This function, if activated, will automatically put a rel attribute to all image links.
 * If there is more than one image in the post, images of each post will be set as an imageset automatically.
 **/
function auto_rel_imagelinks ($content) {
        global $post;
        $pattern[0] = "/<a(.*?)href=('|\")([A-Za-z0-9\/_\.\~\:-]*?)(\.bmp|\.gif|\.jpg|\.jpeg|\.png)('|\")([^\>]*?)>/i";
        $pattern[1] = "/<a(.*?)href=('|\")([A-Za-z0-9\/_\.\~\:-]*?)(\.bmp|\.gif|\.jpg|\.jpeg|\.png)('|\")(.*?)(rel=('|\")shadowbox(.*?)('|\"))([ \t\r\n\v\f]*?)((rel=('|\")shadowbox(.*?)('|\"))?)([ \t\r\n\v\f]?)([^\>]*?)>/i";
        $replacement[0] = '<a$1href=$2$3$4$5$6 target="_blank" rel="shadowbox['.$post->ID.']">';
        $replacement[1] = '<a$1href=$2$3$4$5$6$7>';
        $content = preg_replace($pattern, $replacement, $content);
        return $content;
}

        add_filter('the_content', 'auto_rel_imagelinks', 2);
</code>

It works brilliant. Page stays valid. So far I didn't experience any problems. If you got any idea how I can include the possibilitiy to put the image title as an anchor title via the script above, then it's perfect.
I even put a target="_blank" in the links, so the image will still open in a new window if javascript is disabled in the browser.
Only problem with the target _blank: If an image for any reason already has a target attribute definde, page get:'s invalif because of redefining a target attribute.
I tried to put extra lines in it like the following:
<code>
$content = str_replace(' target="_blank">', '>', $content);
$content = str_replace(' target="_self">', '>', $content);
</code>
Didn't get it working so far. I'm quite bad in programming.

If you know how to get it working, please let me know.
Even better would it be, if the target _blank is only written by the script, if no target _blank is set.

I will too ask the author of the wordpress plugin for held and will give him the code for implementation.