Tuesday, 29 October 2013

wordpress shortcode to make featured image gallery from pages

what I was looking to do here is to have a shortcode that shortcode that shows the featured images of a range of Post or Pages.

One issue I've had to overcome here is that I couldn't get get_the_post_thumbnail to work for me.

Here's the code I've written which you'll need to put in your templates function.php
function page_featured_images_ofparent() {
$postid = get_the_ID();
$children = get_children($postid);

foreach ($children as $child):
// print_r($child);
 //echo "

"; $child_id = $child->ID; $URL = $child->guid; $title = $child->post_title; // echo "Child Id = $child_id
"; if(has_post_thumbnail( $child_id )): $image = wp_get_attachment_image_src( get_post_thumbnail_id( $child_id ), 'thumbnail' ); // 'single-post-thumbnail' $image_url = $image[0]; echo ''; endif; endforeach; return; } add_shortcode ('page-feat-img-childs', 'page_featured_images_ofparent');

and you can use the code

Put this wordpress shortcode on any of your posts or pages and it will show all the featured images of any child post or blogs.

Tuesday, 22 October 2013

CSS Fix: ipad phone numbers different color

on the ipad ( and not the screenfly ) phone numbers are recognised and rapped in 'a' tags.  this means in your CSS you need to cover this child class of your current class too.


.phonenumber {
color: #fff;

should be

.phonenumber, .phonenumber a {
color: #fff;

Wednesday, 16 October 2013

Wordpress how to display a different page for mobile

Essential what I'd like to do is to show a different landing page when a user arrives from a mobile device.  The only thing is I can't seem to find a plugin that does just that.  Most mobile plugins are designed to change themes and not just the static page. 

Rather than make the needed plugin what I'm going to do is use some CSS tricks to display the content I want on mobiles and not on larger screens.

So in concept you have something like

@media handheld, only screen and (max-width: 649px)  {
.largecontent { display:none; }
@media handheld, only screen and (min-width: 650px)  {
.mobilecontent {display:none;

Monday, 14 October 2013

6 Very Useful Wordpress plugins to complete a wordpress project.

Please take a look at my Wordpress installation Check list. This blog is written as a follow up to that to suggest some Plugins that I'm using on multiple sites and are becoming essential for some types of website. Some are essential plugins if you're making wordpress website for clients.

Mailchimp for WP Lite - Build yourself a list for sending newsletters.

Jigoshop - Ecommerce solution. There are a heap of these to choose from and some close runners. The thing I like about with Jigoshop is that the logic of code of this plugin seems to make the most sense to me. So it's become my favourite.

WP Help - add help pages to the admin section. This means any help given to clients can just be added to this section. No more looking through emails to find that help that was sent. A must add Plugin for all websites that are not made for your self.

Google Maps v3 Shortcode multiple Markers

My goto plugin to show google maps. Excellent for multiple spots. adding graphics and area shading . Take a look at my blog How to draw multiple circles on your Google Map.

Facebook Comments - let people use their facebook profiles and login to leave comments .

Admin Menu Editor for Wordpress .

Change the look of the Admin menu representation for your users.

Tuesday, 8 October 2013

Wordpress themes - adding to a class to identify the home page.

Here's a quick one.

I need to add a classname to my sidebar; so that I could identify if I was on the homepage or not.

take this tag

this would need to change to


Friday, 4 October 2013

Responsive CSS example for Ipad and Smart Phones

One thing that has kept those of us in Website Development busy over the last few years is to make sure clients websites work in all browser.

One go to tool I've been using is this Website Screenfly - test your website in different sizes.

The following snippet of CSS code is to help you write specific CSS for different sized browser you want to target.  In this example I isolate Ipad ( horizontal ) and smartphones ( horizontal ) for my changes.

@media handheld, only screen and (max-width: 1280px) and (min-width: 650px) {
.tp-bullets {
font-size: 18px !important;

@media handheld, only screen and (max-width: 649px) and (min-width: 240px) {

 .tp-bullets {
font-size: 15px !important;
padding-left: 15px

Wednesday, 2 October 2013

How to make changes to the slide in Sommerce theme.

Wordpress theme Sommerce comes with it's own slider which is why the location for making changes in admin to this Slider isn't accessed on the left hand menu; like most other Wordpress slider. Here's where you need to go to make changes to it.

In Wordpress Admin:

* Click on 'Themes' on the left hand side.

* Click on 'Theme Option'

* Click on Sliders

* Scroll down to 'Add/Edit slide' if you want to add or make changes.

Tuesday, 1 October 2013

How to add functions in wordpress child theme

One thing when Wordpress - Add a Widget space to a template and add a widget to it.  that I was not sure about when adding the menu is how to do that in a child theme.

There's a fairly clear instruction to this in the functions.php of the 'twentytwelve' theme.  and that is

 * When using a child theme (see http://codex.wordpress.org/Theme_Development and
 * http://codex.wordpress.org/Child_Themes), you can override certain functions
 * (those wrapped in a function_exists() call) by defining them first in your child theme's
 * functions.php file. The child theme's functions.php file is included before the parent
 * theme's file, so the child theme functions would be used.

In the case of a menu item; all you need to do is save a new file as functions.php in your child and add

    'name' => 'Banner Ads',
    'id' => 'bannerads',

that's enough.  as you're adding to a function .

Check Add functions to your wordpress child theme for more information. []