Uncategorised, WordPress

woocommerce product page order

I needed to change the order of the elements on a clients woo-commerce product page. There are actually a few ways to achieve this, but the best is through the default hooks already set-up in Woo-commerce.

Inside the Woo-commerce plug-ins template ditrectory sits the content-single-product.php which contains all the info we need.

Location: plugins/woocommerce/templates/content-single-product.php

<div class="summary entry-summary">

        <?php
            /**
             * woocommerce_single_product_summary hook
             *
             * @hooked woocommerce_template_single_title - 5
             * @hooked woocommerce_template_single_rating - 10
             * @hooked woocommerce_template_single_price - 10
             * @hooked woocommerce_template_single_excerpt - 20
             * @hooked woocommerce_template_single_add_to_cart - 30
             * @hooked woocommerce_template_single_meta - 40
             * @hooked woocommerce_template_single_sharing - 50
             */
            do_action( 'woocommerce_single_product_summary' );
        ?>

    </div>

As you can see the action is ‘woocommerce_single_product_summary’ and each of the hooks are followed by priority number, the lower the number, the sooner it appears on the page.

In order to sort the info into the order you want, the easiest method is to remove the relevant hook, and then re-add the hook back in.

remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_price', 10 );
add_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart', 25 );

It’s a pretty simple method, and will remain in place if you update woo-commerce.

Standard
web dev, WordPress

google maps

Revisited a script to integrate google maps into a Joomla! article. The idea was to take the postcode that is entered on the page and insert a map.
Firstly added in the call to maps.googleapis, in Joomla! this was added to the index.html in the theme

<script type="text/javascript"
      src="https://maps.googleapis.com/maps/api/js?key=&sensor=false">
    </script>

As was the main javascript for the map.

 <script type="text/javascript">
      function initialize() { 
    var geocoder = new google.maps.Geocoder();

    var postCode = $("postal-code").innerHTML;
        geocoder.geocode( { 'address': postCode}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                var mapOptions = {
                    center: results[0].geometry.location,
                    zoom: 17,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                var map = new google.maps.Map(document.getElementById("map-canvas"),
                          mapOptions);
                
                var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location
                });
            }
        });


   }
      google.maps.event.addDomListener(window, 'load', initialize);
</script>

It was just then a case of styling in CSS and adding the map to the article, which was done as a Joomla! template file, ensuring that

<div id="map-canvas"> </div>

was set.

The last part of the job is to ensure that the post code is correctly wrapped, and this was done with

<span id="postal-code">POSTCODE</span>

in a Table.

Pretty easy to just to move this around to WordPress or anywhere. And easy to configure, you can see it in action here paada.com

Standard
web dev, WordPress

woocommerce custom attributes

Needed to add a custom product attribute to a single product page, just below the title in Woo-commerce. Wasn’t actually too difficult:

In your ‘functions.php’ file add the below, changing ‘designer’ to the slug of your custom attribute, you need to keep the pa_

function get_by_data(){
global $product;
$attributes = $product-&gt;get_attributes();
$attribute = isset($attributes['pa_designer']) ? $attributes['pa_designer'] : '';
if ( ! $attribute ) {
return;
}
if ( $attribute['is_taxonomy'] ) {
$out = implode( ', ', woocommerce_get_product_terms( $product-&gt;id, $attribute['name'], 'names' ) );
} else {
$out .= $attribute['value'];
}
echo $out;
}

Then after creating the correct structure for a woo-commerce template in your theme, or child theme /themes/YOURCHILDTHEME/woocommerce/

create a copy of the title.php file in

/themes/YOURCHILDTHEME/woocommerce/single-product/title.php. In this file add:

<?php
/**
 * Single Product title
 *
 * @author      WooThemes
 * @package     WooCommerce/Templates
 * @version     1.6.4
 */
if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
?>
<h1 itemprop="name" class="product_title entry-title"><?php the_title(); ?></h1>
By <?php get_by_data(); ?>

Obviously you can add the custom attribute to whichever area you like.

Standard
Random

interesting day

I had my first experience of going to court today, after taking a former client to the small claims court for not paying their bill. This was not due to the work done, my work is fantastic, trust me!, just because they were clearly not nice, trustworthy, honest or well, they were just dodgy. I had already found out this was not the first time they had done a similar thing before I decided to take it to the small claims court, and to be honest I should never have started the work without taking a deposit upfront, something I normally always do. Anyway, my day in court came today, was quite nervous though very confident, and it lasted 30 seconds. The judge found in my favour and that was it. Doesn’t mean I will get the money, but it is a start! Was a bit of a let down really, no chance for an argument. Anyway, onwards and upwards, will let you know if I ever get paid by him, I mean it’s only been 7 months!

Standard
web dev

sculpt responsive framework

This week I have gone back to the people over at Heart Internet for another look at their web design framework, Sculpt. It’s pretty lightweight andsculpt web design framework and sass mobile-oriented and includes the flexibility of SASS. The reason I have gone back to it, is because they have a competition going. Now sculpt comes without any support at present, so if you use it you are free to do anything you like with it, and if you are building a quick static site it is a great tool to use, particularly if you are designing for small screens and want to expand on features as the resolution increases. Go take a look at it over here Heart Internets Sculpt.

 

Standard
WordPress

theme

After considerable time pondering about how I would lay this site out, what content I would add, and what theme to use, or whether to do a custom build, I eventually decided to stick with a tried a tested free WordPress theme, Ryu. It is a really simple, slick theme as you can see, and hopefully allows you to concentrate on content and commenting, rather than finding your way around the site.

It did make me think about all the themes I have used and abused over the years, and I thought I would give a few links to some of the better ones available to you.

The first one is the Thesis Theme for WordPress: It has options galore and a really helpful support community. The beauty of the Thesis theme is its flexibility. It has so much to offer, and is a great theme for the price. The support is pretty much second to none, and has a massive support community to help users and developers a like.

Decided to just add the thesis theme for now, will get round to some other feedback on themes in later posts.

What does everyone like using? Anyone used the Thesis theme?

Standard
Random

new site

I have recently just acquired this site, I was looking for a site that would allow me to post what I was working on, had been working on, will go back to work on, finished working on, and just plain liked, when I thought of this domain name. Unfortunately it had been previously used, but as it came available recently I snapped it up from DynaDot hosting and here it is.

Having looked into the site and the previous incumbent, I thought it would be useful for those that might be looking fro the previous user, to link you to his new site. So here it is: CJ Melegrito.

I also have to say he has created some great pieces of work and it is well worth taking a look at his Blog and social media pages.

 

Anyway, I will start getting some stuff on here pretty soon.

laters

Standard