scriptygoddess

On a site I was working on recently, the client was using the Featured Content Galleries plugin for their homepage (you can download it from here) – but they wanted to add a gallery like this to other pages on their website and have other featured content on those pages. This is not a feature currently supported "out of the box" with this plugin. But hacking it in is pretty easy.

First – you will need to create a category that you will use for the other Featured Content Galleries – one per page you want to use it with. Assign posts you want to appear in the featured content gallery with this new category. For example – lets say on your homepage you're running the featured content gallery, and it's showing posts from the "featured-posts" category. But lets say you have a "products" page and on that page, you only want articles related to your products showing up on that page. So you would need to create another category – lets call it "featured-posts-about-products". Then assign this new category to your articles about products. (**Make a note of what the category ID is of this new category!)

You will still need to make sure those posts have a custom field with a key of "articleimg" and a value that is the full URL to the image you want in the featured content gallery.

Now we can start hacking at the plugin…

Open up gallery.php (found in the featured-content-gallery plugin directory). MAKE A BACKUP OF GALLERY.PHP JUST IN CASE! :) Then, look for this line:

query_posts('category_name=' . get_option('gallery-category') . '&showposts=' . get_option('gallery-items'));

and replace with the following:

$categoryToUse = 'category_name=' . get_option('gallery-category');
if (isset($catidforgallery) && is_numeric($catidforgallery)) {
$categoryToUse = 'cat=' . $catidforgallery;
}
query_posts($categoryToUse . '&showposts=' . get_option('gallery-items'));

NOW in your theme – where you have the featured content gallery appearing – if you want it to pull from that special category, you can do this:

<?php 
$catidforgallery = 1234;
include (ABSPATH . '/wp-content/plugins/featured-content-gallery/gallery.php'); 
?>

The above code assumes our category ID is "1234".

But lets say you're using this template for a number of different pages, and on each one you want a different content gallery… Again, set up these new categories, make notes of what their IDs are – then on each page that's using this template, to specify what category ID the featured content gallery should use, add a custom field with a key of "category-feature-rotator" and a value of the category ID you want in the gallery.

Modify the theme/template code to this instead:

<?php
$category_feature_rotator = get_post_meta($post->ID, "category-feature-rotator", true);
$catidforgallery = false;
if (isset($category_feature_rotator) && $category_feature_rotator != 0) { 
$catidforgallery = $category_feature_rotator;
}
include (ABSPATH . '/wp-content/plugins/featured-content-gallery/gallery.php');
?>

That will look for the custom field and use the category ID you put in for that custom field – and if it's not there – then it will just default to the category specified on the Featured Content Gallery options page.

IMPORTANT NOTE: If/when there is an update to the Feature Content Gallery plugin – upgrading will overwrite these changes. This post was written for version 3.2.0 of the plugin. Hopefully they'll build this feature in a next release of the plugin. 😀

UPDATE 11/16/09 Greg had asked in the comments about being able to do a similar technique with multiple featured content galleries, but being able to specify page IDs. He was able to solve the problem before I could and sent me the solution. :)

To use Page IDs in the gallery: On the page you want to have the gallery displayed on, create a custom field with a key of "pageids" – and for the value, give a comma seperated list of page ids.

Where I had been pulling the "category-feature-rotator" custom field – replace that with the following:

$pageids = get_post_meta($post->ID, "pageids", true);

Then look for the following line in gallery.php (should be around 24)

$arr = split(",",get_option('gallery-items-pages'));

and change it to this:

$arr = split(",",($pageids));

*Note: I haven't personally tested the Page ID method – so if you try it – please report back how it goes…

Background: For a site I was working on, I was pulling in content from another page onto the homepage. However I wanted to just bring in an excerpt not the whole page. (And actually, a customized excerpt at that – not a default set character or word limit). I also didn't want any images brought in – I just wanted the text and any associated formatting.

Well, one problem here is that WordPress pages (at least as of this writing – with WordPress in version 2.8.5) do not have excerpts for pages. Only for posts. The way around this is to use the <!-- more --> tag where you want your break. So that works fine – but what about stripping out the images? I'm still working on my reg-ex knowledge, but I found this one from here and it worked for me. So this is what I'm doing when I'm pulling in my page excerpt:

<?php
$posts = query_posts('page_id=1234');
if (have_posts()) : while (have_posts()) : the_post();
//this makes the more work...
global $more; $more = 0;
?>
<h1><?php the_title(); ?></h1>
<?php
$content = get_the_content('');
$content = preg_replace('/<img[^>]+>/is', '', $content);
echo $content;
?>
<p><a href="<?php the_permalink(1234); ?>"><img src="/images/more.gif" /></a></p>
<?php endwhile; endif; ?>

*we're assuming "1234" is the ID of my page in the example above…

You'll also notice I manually added my "more" button image…

To read more about the more tag (and see where I got that global $more; $more = 0; from, you can see the WordPress codex here on the subject. (Scroll to the very bottom of the page – to the section title "How to use Read More in Pages")

I just saw this plugin show up on the WordPress Plugins list. WOW! I haven't had a chance to use it yet, but can think of a dozen places where I can use this feature!!! Very excited to see it!

Secondary HTML Content – WordPress Plugin

07 Oct, 2009

Delink Pages Plugin

Posted by: Jennifer In: WordPress|WordPress Plugins

(Plugin and this post last updated: 10/20/2009 – Latest Plugin Version: 1.1.1 – see changelog at bottom of post)

I have been wanting to do more wordpress plugin development, but it has a somewhat steep learning curve. So I'm testing the waters a bit here. I've done some testing with the plugin, but feedback is appreciated. For now, if you have problems with the plugin, leave a comment here. PLEASE include contact information (fill out the email field with a valid email address!!), a URL where you have the plugin installed, any errors you're getting, etc. The more information you give me, the more likely I will able to fix the problem.

Plugin Description

This plugin will allow you to specify certain pages to not be linked when wp_list_pages() is used in your theme. You might want to do this if you want a header for a series of subpages, but don't specifically want that header to be a real "page" or link.

For example – you have a series of pages like this:

As of version 1.1 of this plugin there are two ways you can go about doing this. You can either remove the link entirely. As in no <a> tag at all like this:

OR you can remove the link to the actual page and sawp it out for a blank link to "#".

Usage

To use the plugin, download the zip, and unzip the file. Install it by putting the scripty-delinkpage.php in your wp-content/plugins/ directory. Activate it through the WordPress admin. Then, on pages you do not want to have a link, add a custom field with a key of "delink" and a value of "true" when you want to remove the link completely, or a value of "href" when you want the href value to be "#".

Download

You can download this plugin from wordpress.org plugin directory here: Delink Pages

Changelog

Version 1.1.1
Minor bug fix to preg_replace

Version 1.1
Added option for delink to have a value of "href" when you want don't want the link to be removed entirely but be linked to "#"

Version 1.0
Initial release

One of my clients had set it up so that one particular page in their WordPress install would load as https:// and even though they changed all links they could find in their template to use root-relative links, they were still getting complaints from IE about the page loading some secure and non-secure items. A look through the source code revealed that two plugins in particular (an event manager plugin and cforms plugin) pulled in their CSS or javascript files without the https. It probably got these settings from the main WordPress install, which wasn't set to use ALL https – the had just set it up so that this one page would be (using a special template for https pages). But there was no way to get that information to the plugin… So I needed to do a little hacking to the plugin(s) and add in a conditional statement that would check if the page being viewed was https – and if so, swap out http:// for https:// in the path to the file.

In the case of the cforms plugin, the file I had to modify was cforms.php – the line I found that pulled in the file path looks like this:

$cforms_root = $cformsSettings['global']['cforms_root'];

So, just below that I added this:

if(isset($_SERVER['HTTPS']) || $_SERVER['HTTPS'] == "on") {
$cforms_root = str_replace("http://","https://",$cforms_root);
}

Pretty simple. Of course, if/when we need to upgrade the plugin, the change will be overwritten – but it's pretty easy to add back in…

(Apparently, I'm not the only one with this issue…)

In the case of the event manager plugin, the file I modified was dbem_events.php:

So just below this:

function dbem_general_css() {  
$base_url = get_bloginfo('url');

I added this:

if(isset($_SERVER['HTTPS']) || $_SERVER['HTTPS'] == "on") {
$base_url = str_replace("http://","https://",$base_url);
}

No more complaints from IE.

Comments Off on Conditionally change path to HTTPS

One problem with the WYSIWYG editor in WordPress is that if you are trying to manually add in a block of HTML, the editor may try to translate that block into paragraph format, inserting <p> tags where you didn't intend, possibly (and most likely) ruining what you were intending to do with your HTML code block.

Previously, my way around this had included the use of various plugins that had you wrap certain areas in your post with specific comments that would tell WordPress to leave that block alone and not insert those paragraph tags. There was still some issues doing it this way – as it required you to view these posts in the HTML view. Viewing them in the visual editor would mess everything up.

So, keeping in line with what seems to be a current trend at the moment of solving all my problems with shortcodes, that's how I've decided to solve this problem as of late.

First – (you'll only need to do this once) – add the PHP code so that you can do the shortcode. If you don't already have a functions.php file in your theme directory, create one and add the following code:

function scriptysAddHTML_func($atts) {
global $post;
$id = $atts['id'];
if (empty($id)) return;
return get_post_meta($post->ID, $id, true);
}
add_shortcode('html', 'scriptysAddHTML_func');

Then, in your post when you want to add some custom HTML, paste your block of HTML into the value of a new custom field. For the name of this custom field, give it a unique name with no spaces. (For example: My_HTML_Block)

In your WordPress post, where you want this block to appear, add the shortcode like this:

[html id=My_HTML_Block]

You would add it exactly like the above, except instead of My_HTML_Block, you would change that to be the name you gave your custom field.

Extra Tip If for some reason, you're using more than one shortcode in your post and it doesn't seem like they're working… if you're using them one right after the other, make sure there is a space between them. ie. If you're using my linebreak shortcode, and you were adding more than one linebreak… it might not work if you do this:




You my have to do this:




Little minor thing, but something you might not have thought of… figured I'd mention it. :)

This is possibly the most bizarre thing I've ever seen. (This is relevant to version 2.8.4). If you have your WordPress install set up to be http://www.yourdomain.com but your blog install set up to be http://yourdomain.com (note the missing "www") and you try to search for posts from with the WordPress admin, you get redirected to your blog's (front end) homepage. If you change your WordPress install to match your blog install (ie. remove the WWW – then it works fine) Sounds like a bug to me. I'll submit it to the WP team and see what they say – but in the meantime should you be up past 1am trying to figure that little gem out, hopefully I've saved you some trouble and you can get to sleep earlier than I did. LOL!

I was recently asked by a client how they could easily add anchor links within a particularly long post they had made in WordPress. (Ie. a list of links at the top of the page that would jump the user down to the appropriate section where they needed to be.) I thought about maybe explaining to them to switch over the HTML tab and writing the HTML for the anchor links, but that step alone can sometimes really freak some clients out. :) So I came up with a solution to the problem using shortcodes and using the "build link" button already in the WordPress edit post box.

So the first step is to create the code so the shortcode will work. If you don't already have a functions.php file in your template directory, make a new file, name it "functions.php" and add the following code (surrounded by <?php and ?>). If you do already have a functions.php file, add the following code within those php tags:

function anchorlink($atts) {
extract(shortcode_atts(array(
"id" => ''
), $atts));
return '<a name="'.$id.'"></a>';
}
add_shortcode('anchor', 'anchorlink');

Then, in your post. In front of the location you want to be able to create a link to add the following:

[anchor id="unique_id_here"]

So for example.. If your post is a "Q/A" type page, down where you have the full question and answer, add that shortcode:

[anchor id="elephantquestion"]Q: What do elephants eat?
A: Elephants eat mainly grass, leaves, bark and twigs. Sometimes they will also eat fruit and seeds.

Then at the top – where you probably have a list of all the questions on the page like this:

What do elephants eat?
What do giraffes eat?
etc.

(In this example) highlight the "What do elephants eat" text, click the LINK button in the edit post area – remove the "http://" that automatically is included in the link field that pops up and instead, add a pound symbol # and then the id you used:
Screen shot 2009-09-10 at Sep 10  11.51.47 AM

I know this isn't a huge leap from simply writing the HTML that does this. But I've found that some clients don't understand (and don't want to understand) HTML. This IS actually simpler for them. Especially when you might run into the scenario of someone forgetting to close the anchor tag with a </a> – and suddenly the whole page is acting weird… I also think it's probably helpful to SEE the ID right there in plain text in the post – so that when you're making the links at the top, you can quickly see what the ID is that you need to link to.

29 Aug, 2009

Simple Shortcode for Line Breaks

Posted by: Jennifer In: WordPress|WordPress Hacks

One kind of funny thing with WordPress is that entering HTML in the post window can sometimes lead to unexpected results. Sometimes WordPress (or probably more specifically the WYSIWYG visual editor) will eat some or all of the HTML. A friend of mine (Hi Chris!) was asking me how to add line breaks to her post. Adding the actual HTML for a line break didn't work because WordPress ate it. The simplest solution for this is to use shortcodes to get the HTML into the post without WordPress munching it.

To add the shortcode – go to your themes functions.php file (if you don't have this file in your theme, simply create a file called "functions.php" and throw it in your theme folder.) Then add the following code to this file (make sure the function name doesn't class with something else already in there just in case!)

function breakall() {
   return '<br clear="all" />';
}
add_shortcode('br', 'breakall');

Now, when writing your posts, if you need to add a line break or two just add the following where you want the linebreak:


That will be converted to <br clear="all" /> when the page is displayed.

Shortcodes are an amazingly powerful little feature. Read more about shortcodes here:

Shortcode API
Mastering WordPress Shortcodes
10 Incredibly Cool WordPress Shortcodes

28 Aug, 2009

Playing with Post Attachments

Posted by: Jennifer In: WordPress|WordPress Hacks

I've been doing a ton of sites recently using WordPress (almost always as a CMS, and only occasionally as a real BLOG) – and there is a lot of power that can be gained by playing around with the post attachments. Specifically if you want photos or documents that are "attached" to a post to show up somewhere outside of the "loop". (FYI: Something that is "attached" to a post means that you uploaded a photo, video or document when editing a particular post. That file is then associated (aka "attached") with that particular post)

If you have the post's ID you can pull attachments anywhere in your layout, and on any post or page in your WordPress site. Here's an example: On one site, my client is using WordPress for their press releases. For each "post," in a sidebar, they wanted to have some photos and copies of the press release for download in various formats (Word, PDF, and Text). So the first trick is getting and saving the current post's ID. (*I'll add that maybe I'm missing something here, but when I've tried to pull out the post ID outside of the loop or with other methods, I would tend to have some unexpected results. This worked – so I've just stuck with it)

So, we're working on the single.php template file. Before you start the loop – declare the variable we'll be using in the sidebar:

<?php $thepostid = ""; ?>

Once inside the loop, we need to fill the variable with the post id of the current post:

<?php $thepostid = $post->ID; ?>

Now we can use $thepostid anywhere we like… So in our sidebar, here are various ways to grab attachments, based on their file type.

This will grab all images attached to the post, sorted by the "sort order" you entered in the "gallery" tab in that media popup for the post:

$images = get_children(array(
'post_type' => 'attachment',
'post_status' => null,
'post_parent' => $thepostid,
'post_mime_type' => 'image',
'order' => 'ASC',
'orderby' => 'menu_order ID'));

This one will pull any attachments that are word docs:

$worddocs = get_children(array(
'post_type' => 'attachment',
'post_status' => null,
'post_parent' => $thepostid,
'post_mime_type' => 'application/msword'));

Change "post_mine_type" to 'text/plain' for .txt files, or 'application/pdf' for .pdf files. Here's a list of more mime types you can specify. (That list has a bunch of file types you'd probably never use in WordPress – but it's pretty complete)

Using the Word docs example – If we want to automatically list and link to the word docs attached to the post then we can do the following:

if ($worddocs) {
foreach($worddocs as $worddoc) {
echo '<p><a href="'.$worddoc->guid.'">Word Format</a></p>';
}
}

FYI – $worddoc->guid is the path to the file. In fact, while we're on that subject, once you've pulled in the attachments, there's a lot of info you have at your fingertips when you run that foreach loop. Some of these aren't really applicable to an attachment – but they're in there anyway: (I've bolded the ones most useful)

  • ID (attachment's ID)
  • post_author
  • post_date (date attachment was uploaded)
  • post_date_gmt
  • post_content (attachments description)
  • post_title (attachment's title)
  • post_excerpt (attachment's caption)
  • post_status
  • comment_status
  • ping_status
  • post_password
  • post_name (attachment's filename without the extension)
  • to_ping
  • pinged
  • post_modified
  • post_modified_gmt
  • post_content_filtered
  • post_parent (The ID of the post the attachment is associated with)
  • guid (Full URL to attachment)
  • menu_order (Gallery sort order)
  • post_type (For attachments, this will be "attachment")
  • post_mime_type (This is where you can specifically look for the mime type. Images will be image/jpeg image/gif image/png etc.)
  • comment_count

Here's an example of looping through those images. (This is what I used in that Press release template. We wanted to show the thumbnail for the image, then offer a link to download the other sizes of the photos as well as show the caption for the photo)

<?php
if ($images) {
foreach($images as $image) {
//get thumbnail of image first: (we'll actually display this one)
$attachment=wp_get_attachment_image_src($image->ID, 'thumbnail');
?>
<p class="thumbnail"><img src="<?php echo $attachment[0]; ?>" <?php echo $attributes; ?> /></p>
<p class="imagecaption"><?= $image->post_excerpt; ?></p>
<?php
// get medium size image image next, we'll just link to this one
$attachment=wp_get_attachment_image_src($image->ID, 'medium');
?>
<p class="imagelink"><a href="<?=$attachment[0];?>" target="_blank">View Large Image</a></p>
<?php
//Now get the full size image, again just linking for people to download
$attachment=wp_get_attachment_image_src($image->ID, 'full');
?>
<p class="imagelink"><a href="<?=$attachment[0];?>" target="_blank">View High Resolution Image</a></p>
<?php }
} ?>

So here's a VERY IMPORTANT thing about using that $thepostid in the sidebar template. If you pull in your sidebar into your template using the standard get_sidebar(); the value of $thepostid will not be retained. You will have to pull in your sidebar as an include like so:

<?php include( TEMPLATEPATH . '/sidebar.php' ); ?>

Here are some extra things you can do. Let's say on some posts, you want to be able to specify it to ignore pulling in the attachments like this. Solution: Add a custom field for that post in WordPress – then in your sidebar file, have it check for the value of that custom field before pulling in the attachments.

So for this example, on the post, the custom field you would add would have a key of "showimages", and a value of "false" on posts you don't want to have the attachments show up on. Modify your sidebar and add the following before you pull in the attachments:

$showimages = get_post_meta($thepostid, "showimages");
if ($showimages != "false") {
... pull in attachments ...
}

Ok another extra: Let's say you've already uploaded a photo to a DIFFERENT post, and you want that included in our sidebar for THIS post. This gets a little trickier. You have to know the ID of the actual attachment you want to add in. Kind of hard to find this, but if you go to "Media" (WordPress side navigation) – it will show you a list of all the attachments you've ever uploaded. Find the one you want to add to your post. If you mouseover the "edit" link for that attachment and if you look at the "status" in your browser (very bottom of the browser window) – you'll see a URL that probably looks something like this:

http://www.yourdomain.com/wp-admin/media.php?action=edit&attachment_id=1607

Make a note of that "attachment ID" – that's what you need for this…

Go back to editing your post. You'll add a custom field for each extra image you want to pull in. The key for each will be "extraimage" the value will be the attachment ID. In your template you need the following:

$extraimage = get_post_meta($thepostid, "extraimage");

(The above pulls in an array of those custom fields – it will be an array of attachment IDs that you wanted to pull into the sidebar)

Now we'll first check to see if we even HAVE any values in there

<?php
if ($extraimage) {
//Now loop through images specified in custom fields...
foreach($extraimage as $imageid) {
//notice this is not get_children! That's because we're using the attachment ID specifically - not the POST's ID
$image = get_post($imageid);
$excerpt = $image->post_excerpt;
//get the thumbnail to show
$attachment=wp_get_attachment_image_src($imageid, 'thumbnail');
?>
<p class="thumbnail"><img src="<?php echo $attachment[0]; ?>" <?php echo $attributes; ?> /></p>
<p class="imagecaption"><?= $excerpt; ?></p>
<?php
//get the medium size for the link
$attachment=wp_get_attachment_image_src($imageid, 'medium');
?>
<p class="imagelink"><a href="<?=$attachment[0];?>" target="_blank">View Large Image</a></p>
<?php
// get the large size for the link
$attachment=wp_get_attachment_image_src($imageid, 'full');
?>
<p class="imagelink"><a href="<?=$attachment[0];?>" target="_blank">View High Resolution Image</a></p>
</div>
<?php }
} ?>

Here's my last little trick. In some cases – some images you'll want to have show up in the sidebar, and others, you may actually be including in the post itself. The ones being included in the post itself, you probably don't want repeated in the sidebar – so to distinguish one between the other, we can use the "sort order" to tell whether it should be included or not. When you're uploading your images, set the sort order to 1 for any image you DO NOT want included in the sidebar, and then you can use 2 and up to control the order and indicate the images you DO want included in the sidebar. (Little side note: The default sort order for images you upload will probably be BLANK which means it's 0 – which, using this method, means it will not automatically show up in the sidebar unless you give it a value or 2 or greater) Some slight adjustments to the code to check for that menu order (aka sort order) are as follows.

Just showing a snippet of what we've done above so you get the idea.

foreach($images as $image) {
if ($image->menu_order > 1) {
$attachment=wp_get_attachment_image_src($image->ID, 'thumbnail');
echo '<p><img src="'. $attachment[0].'" /></p>';
}
}
}

Featured Sponsors

Genesis Framework for WordPress

Advertise Here


  • Scott: Just moved changed the site URL as WP's installed in a subfolder. Cookie clearance worked for me. Thanks!
  • Stephen Lareau: Hi great blog thanks. Just thought I would add that it helps to put target = like this:1-800-555-1212 and
  • Cord Blomquist: Jennifer, you may want to check out tp2wp.com, a new service my company just launched that converts TypePad and Movable Type export files into WordPre

About


Advertisements