• Hi All,

    Is there a way to manipulate a gallery’s shortcode for the REL tag? I use prettyphoto in my template and it would be really, really (really really really!) handy to be able to change the REL tag, so they all read REL=”prettyphoto”.

    Any ideas how to go about this??

    Thanks!

    Ansel

Viewing 13 replies - 1 through 13 (of 13 total)
  • You can do that, but it would require modifying the core (which I have been told is a no no).

    No Core Mod:
    Add this to your functions.php file in your theme:

    add_filter('gallery_style', create_function('$a', 'return "
    <div class=\'gallery\'>";'));
    
    add_filter( 'wp_get_attachment_link' , 'add_lighbox_rel' );
    function add_lighbox_rel( $attachment_link ) {
    	if( strpos( $attachment_link , 'a href') != false && strpos( $attachment_link , 'img src') != false )
    		$attachment_link = str_replace( 'a href' , 'a rel="lightbox" href' , $attachment_link );
    	return $attachment_link;
    }

    and for good measure use the following jquery:

    $(".gallery a, .lightbox, .gallery a[rel^='prettyPhoto'], a[rel^='prettyPhoto']").prettyPhoto({theme:'facebook'});

    I use several different classes and attributes to cover all basis.

    Core mod: go to your-wordpress-folder/wp-includes/post-template.php
    Line 941 – Make it look like this:
    return apply_filters( 'wp_get_attachment_link', "<a href='$url' rel='prettyPhoto[g]' title='$post_title'>$link_text</a>", $id, $size, $permalink, $icon, $text );

    The [g] is to allow for the “gallery” function to activate.

    Hope this helps!

    Thread Starter Ansel Taft

    (@anseltaft)

    Hi TM,

    I will try the non-core method with a little bit more help. Where do I insert the jQuery code?

    That was the only place you lost me. πŸ™‚

    Thanks!

    -Ansel

    Thread Starter Ansel Taft

    (@anseltaft)

    Hmmm… I added the code to the functions tag, surrounded it with

    <?php
    ?>

    and received the following error:

    Warning: Cannot modify header information – headers already sent by (output started at /my/server/directory/structure/themes/liquid-magazine/functions.php:176) in /my/server/directory/structure/wp-includes/pluggable.php on line 868

    Any idea what went wrong? Is there a particular spot in functions.php that I need to drop it?

    Thanks,

    Ansel

    Post your functions.php theme on pastie.org and link it here and I’ll take a look.

    A simple way to add the jquery is to the header.php just before the ending /head tag. Where are you activating prettyphoto?

    Copy and paste the contents of your functions.php file here -> http://wordpress.pastebin.ca/
    Then paste the link here.

    Thread Starter Ansel Taft

    (@anseltaft)

    I pasted it as private. I’ve never used the site before, so I don’t know if that would bar you from access or not. (Very cool site, though!)

    http://pastie.org/854177

    This may be redundant, but I added the code to your pastie and pasted it here: http://pastie.org/855648 – Try that as your functions.php file.

    If that doesn’t work, then you may be able to forget about adding the function all together and just use the jQuery to tell the standard gallery markup to lightbox. As I said, you would paste this into your header, just before </head>

    <script src="text/javascript">
    jQuery(document).ready(function($) {
    $(".gallery a, .lightbox, .gallery a[rel^='prettyPhoto'], a[rel^='prettyPhoto']").prettyPhoto({theme:'facebook'});
    });
    </script>

    Try that out and see what happens.

    Thread Starter Ansel Taft

    (@anseltaft)

    I tried both and they wouldn’t work.

    Personally, I am leaning toward the jQuery solution.

    Here’s the page in question:

    http://www.anseltaft.com/general/expertzoo-com-scam-or-legitimate-business/4/

    Any ideas how to get it to work?

    Thanks,

    Ansel

    Thread Starter Ansel Taft

    (@anseltaft)

    /bump

    Any other ideas how to go about auto-filling in rel=”prettyphoto” into gallery tags?

    Thanks

    Ansel

    Thread Starter Ansel Taft

    (@anseltaft)

    Oops. I meant <a> tags. :p

    I use this in my themes. This automatically adds a rel="prettyPhoto" attribute within all <a> tags that link to an image. You can obviously change the attribute. The code is simple and self explanatory.

    // Adapted and Modified from http://wordpress.org/extend/plugins/add-lightbox/
    // Adds a rel="prettyPhoto" tag to all linked image files
    
    add_filter('the_content', 'addlightboxrel_replace', 12);
    add_filter('get_comment_text', 'addlightboxrel_replace');
    function addlightboxrel_replace ($content)
    {   global $post;
    	$pattern = "/<a(.*?)href=('|\")([^>]*).(bmp|gif|jpeg|jpg|png)('|\")(.*?)>(.*?)<\/a>/i";
        $replacement = '<a$1href=$2$3.$4$5 rel="prettyPhoto['.$post->ID.']"$6>$7</a>';
        $content = preg_replace($pattern, $replacement, $content);
        return $content;
    }

    Is there an advantage of actually printing out the explicit “rel” value for each of your image links, vs. setting prettyPhoto with jQuery?

    Just off the top of my head, I would think it would be pretty easy to just say,

    $(document).ready(function(){
    
       $(".gallery a").prettyPhoto();
    
    });

    … or something of the like? to make all <a> tags inside elements with the .gallery class receive the prettyPhoto behavior.

    @amp343 That’s definitely a much simpler and more efficient solution. Thanks, I’ll give that a try as well.

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Gallery Shortcode for REL tag?’ is closed to new replies.