siegetheartist

Mr Shane Gowland, you are a gentleman and a scholar. : )

I can attest that the above code works as intended and without errors. Thank you for your help. I sincerely appreciate your time in helping me resolve this problem.

Thank you Shane. I found that post earlier too. For some reason (for me) instead of displaying the images, it displays the file path of the image. I don’t know how to fix it. Haha. Any ideas?

Thank you for your suggestion. This is a wonderful method to achieve said result, but I want to make it “dummy” proof. If a client forgets to add the featured picture, then it wont show up. : (

So I figure I need a function that checks the post for an image, grabs that image, then I can call that function in the loop on the themes file. Any suggestions?

Also, the post thumbnail method creates a thumbnail. Is there anyway to make it display in its full size rather than a thumbnail?

Thank you for your help

I am trying to create a simple image gallery.

I have a bunch of anchor tags that need its browser behavior modified by jquery so that instead of opening up the image link in a new tab, it loads the picture in a container on the same page.

This is how my functions.php currently looks like

// Load jQuery
	if ( !is_admin() ) {
	   wp_deregister_script('jquery');
	   wp_register_script('jquery', ("http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"), false);
	   wp_enqueue_script('jquery');
	}

	wp_register_script('portfolio_gallery_js', get_bloginfo('template_directory') . "/js/gallery.js");
	   wp_enqueue_script('portfolio_gallery_js');

And this is how my .js file looks like:

// JavaScript Document

jQuery(document).ready(function(){

	jQuery('.thumbnail_image a').click(function(e){
		e.preventDefault();

		jQuery('.thumbnail_image a').removeClass('selected');
		jQuery('.thumbnail_image a').children().css('opacity', '1');

		jQuery(this).addClass('selected');
		jQuery(this).children().css('opacity','.4');

		// Sets up variables based on linked thumbnails
		var photo_caption = jQuery(this).attr('title');
		var photo_fullsize = jQuery(this).attr('href');
		var photo_preview = photo_fullsize.replace('_fullsize', '_preview');

		jQuery('.selected_image').html('<a href="'+photo_fullsize+'" title="'+photo_caption+'" style="background-image:url('+photo_preview+');"></a>');

	});

});

I thought that the current functions.php is already getting jquery because when I do a “view source” on the page I can see it being loaded. It looks like this:

<link rel="alternate" type="application/rss+xml" title="Siege the Artist » Feed" href="http://localhost:8888/feed/" />
<link rel="alternate" type="application/rss+xml" title="Siege the Artist » Comments Feed" href="http://localhost:8888/comments/feed/" />
<link rel='stylesheet' id='admin-bar-css'  href='http://localhost:8888/wp-includes/css/admin-bar.css?ver=20110622' type='text/css' media='all' />
<script type='text/javascript' src='http://localhost:8888/wp-includes/js/l10n.js?ver=20101110'></script>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js?ver=3.2'></script>
<script type='text/javascript' src='http://localhost:8888/wp-content/themes/siegetheartist/js/gallery.js?ver=3.2'></script>

What am I doing wrong to not let jquery work properly???

Yup. That did it. And I learned something. 🙂 I didn’t know that you can open and close the php at will without effecting how it works. Thank you so much for your help. I appreciate it.

Would you please give me an example of what it would look like when “Load CSS here” is replaced with an actual path? Also, if I have more than 2 templates that I want style sheets to load on, would I just continue adding more “elseif” statements? Like this: ?

<?php
if ( is_page_template( 'thispage.php' ) ) {
     Load CSS here
    } elseif ( is_page_template( 'this_other_page_1.php' ) ) {
     Load CSS here
    } elseif ( is_page_template( 'this_other_page_2.php' ) ) {
     Load CSS here
    } elseif ( is_page_template( 'this_other_page_3.php' ) ) {
     Load CSS here
    } else {
     Load CSS here
    }
?>