WordPress woocommerce vs prestashop : 10 minutes to try

If you had only ten minutes to try a full featured opensource ecommerce solution, how would you start ? In my eternal search for the optimal ecommerce platform, I have chosen Woocommerce over alternate solutions because of the technical knowledge I've acquired with wordpress development. But the level of time investment you can spend on each trial depends on how advanced you are on each platform. We have two solutions for you here :

  • CASE NUMBER 1 : COMPLETE WEB BEGINNER
    you have no knowledge of web development of little hosting experience ? want to try something before you make a choice of web agency or ecommerce solution ? Prestashop guys are smart, they have implemented a full featured on line service based on the latest version of prestashop. You create a shop easily and it comes prefilled with products so you can try the backend and front together.

 

  • CASE NUMBER 2 : WORDPRESS GEEK
    Well you love wordpress and do not want to change solution  ? WOOCOMMERCE should be your choice for ecommerce development. PRESTASHOP users won't be surprised to find the same kind of backend navigation, with a lot of CMS features that are the signature of wordpress : custom post types allow you to work with a lot of various content definitions, like pages, posts, portfolio, but also  products and categories that come with WOOCOMMERCE.  Distributed in the form of a plugin, it can be activated in seconds but requires a few additionnal steps to be properly configured and plugged in the existing installation.

Events Calendar Yearly grid view

The famous Event Calendar wordpress plugin from Modern Tribe Company is one of the most popular event manager for wordpress. It creates a custom post type with all required field for event management, and comes with several views including a monthly grid view with very nice tooltips. Many free extensions exist for that plugin and one of them is the category color for event calendar, very useful for dealing with categories and colors for event display in the grid. What was missing was the yearly view and here comes a quick review of how I implemented it on my customer that delivers renewable energy traininig in brittany.

  • create a new template with a loop using the function 
    global $bzhEventDate;
    $bzhEventDate= '2015-03-01' ; tribe_show_month( array( 'eventDate' => $bzhEventDate ), 'month-small' );
  • customise month grid stylesheet to display smaller grid : 
    <style>
    #tribe-events-content {height:400px; margin-bottom:0}
    #tribe-events-content table.tribe-events-calendar { font-size:11px; }
    .tribe-events-month {display:inline; float:left; width:30%; margin-right:2%}
    #tribe-events-content .tribe-events-calendar td {height:50px; padding-bottom:0}
    </style>
  • customize event calendar views (month-small)
  • don't forget to add styles to body class (functions .php)
    add_filter( 'body_class','breizhwave_classes_body' );
    function breizhwave_classes_body( $classes ) {
    if (is_page("3088"))
    $classes[] = 'events-gridview';
    return $classes;

    }

Yearly events view for tribe calendar – sorted by month

wordpress-event-calendarA customer asked me a specific page with all events displayed for the famous Event Calendar Plugin. Nothing hard here : I created a custom page template with the following code - does the job... note that this is for ENFOLD wordpress theme stylesheet but you can easily adapt to other column frameworks like visual composer...

 

$all_events = tribe_get_events(
array(
 'eventDisplay'=>'upcoming',
'posts_per_page'=>-1,
'order' => 'asc'
)
);
foreach($all_events as $post) {
setup_postdata($post);
$month =  tribe_get_start_date(null, false, "F Y");

?>

<article class='post-entry post-entry-type-page <?php echo $post_class; ?>' <?php avia_markup_helper(array('context' => 'entry')); ?>>
 <? if ($oldmonth!=$month) {$oldmonth=$month;?>
<div class="flex_column av_one_third first  avia-builder-el-0  el_before_av_two_third  avia-builder-el-first  ">
<section class="av_textblock_section" itemscope="itemscope" itemtype="https://schema.org/CreativeWork">
<div align="right"><h2><?= ucfirst($month)?></h2> 
</div> </section></div><?}?>


<div class="flex_column av_one_third first  avia-builder-el-0  el_before_av_two_third  avia-builder-el-first  ">
<section class="av_textblock_section" itemscope="itemscope" itemtype="https://schema.org/CreativeWork">
<div align="right">
<h4><a href="<?=get_permalink()?>">du <?=tribe_get_start_date(null, false, "d/m/Y")?> au <?=tribe_get_end_date(null, false, "d/m/Y")?>  </a></h4>
</div> </section></div>

 
 
 <div class="flex_column av_two_third   avia-builder-el-2  el_after_av_one_third  el_before_av_one_third  "><section class="av_textblock_section" itemscope="itemscope" itemtype="https://schema.org/CreativeWork">
 <h4><a href="<?=get_permalink()?>"><b><?= get_the_title() ?> </b></a> </h4>
 <?=get_the_excerpt();?></section></div>


			<div class="entry-content-wrapper clearfix"></div></article>
<?
}
                    ?>

 

WordPress drag and drop base themes

I'm just after trying 2 alternative methods to the now famous visual composer.

  • LayersWP is a base theme that come with an amazing layout builder. It relies on installed widgets, which give a huge flexibility. This featured is common to the Page builder free plugin, that I reviewed last year. LayersWP is really good to use but one drawback I found is that it does not allow you to place a widget over a column : you have the possibility of using columns over content (text / image ) elements but the functionality seems restricted to this very single element
  • Make from ThemeFoundry free layout builder comes with only three elements : text, gallery and slider. not bad for a start but Page Builder plugin does better.

10 minutes to try a wordpress theme option framework

Professional wordpress themes come with so many features and options that it seems impossible to cover them all : how do they do it ? how can you even think of building your own professionnal theme for wordpress if you have to start working on options before you start to code the layout ? here comes options framework plugins that you integrate in your theme, and we do a quick review comparison of them all

  • reddux framework is distributed  as a plugin that you can integrate in your theme. It comes with a full featured working option set and seems to be the most featured plugin for configuring theme options
  • unyson is a bit more difficult to integrate but it comes with several plugins including a layout composer which is similar to the almost universal visual composer.
  • fluent framework helps you add options not only to wordpress / theme but also to any custom post and  / or taxonomy : useful for adding fields to pages and / or posts
  • Titan framework is very well documented
  • VAFPRESS
  • Option Tree
  • Options Framework

Source : http://www.wpsquare.com/wordpress-theme-options-plugins-frameworks/

WordPress Premium themes I’ve used

Having difficulty finding the right codebase for your wordpress design ? fancy trying out premium themes ? check out real live example with this chronological sample of websites I've designed using premium and free wordpress themes. I can't list advantages and drawbacks of them all, the only rule is ... know your stuff, get used to it... and stick to VISUAL COMPOSER for future updates...

and free themes I've used... apart from the twenties series : responsive from cyberchimps for Guilers Auto's website

Removing spam from wordpress gravity form entries

There are many solutions to avoid spam filling your gravity form with unsollicited trash messages. You can use the original gravity forms captcha field  but I would not recommend this basic solution because it requires you to create an account on google's famous recaptcha service. Another drawback of the gravity forms captcha field is that it disables the AJAX option (read on gravityhelp) : if you want to use AJAX option or would like to have you captcha feature hosted on your server, you can use the famous wordpress plugin Really Simple CAPTCHA.

A third solution is to use simple rules on your form like asking the result of a simple mathematic operation like "what does 2+3 make"  and use Min and Max on the number field type. Ok this is for reducing SPAM entries. But once you have caught thousand of bad entries in your form, how do you remove them quickly ?

I encountered the problem with a few thousand of SPAM entries dropped to my favourite contact form in less than an hour. Manual deletion of thousands of messages is easy but tedious when the default 20 entries per page makes you repeat the same operation a few dozen times. Here comes the gform_entry_page_size filter, detailed on gravityforms documentation : simply code the following filter in your thems functions.php file and depending on your server capacity you can substantially increase the number of entries displayed on the messages page, and accelerate the stupid deletion task..

And next time remember to setup antispam strategy..

Export lightroom photos preserving folder structure

Lightroom photography solutions do not allow to export multiple images (to JPG, for instance) while retaining folder structure. There are two plugins that do the job and we strongly advice to choose the frist one because it is maintained as of 2014 / 10

 

  • http://regex.info/blog/lightroom-goodies/folder-publisher
  • http://www.photographers-toolbox.com/products/lrtreeexporter.php?sec=change

10 features for a perfect wordpress starter theme

These are very important features we'd like to recommend if you want to develop your own commercial themes. Remember that themes are supposed to be used and reused on many sites, which means various configuration options, either codebased of configuration based

  • Theme customizer :
    • Logo upload for theme customization is now a standard wordpress feature, documented on the codex. The custom header feature allows you to uypload your logo, and possibly cropping of the uploaded image. Interesting when trying it variations of formats and or colors.
    • Layout options :
      • theme customizer should allow you to define layout options like : full width, fixed width with max width specification (1020, 960, you pick). Of crouse any serious theme layout should be full responsive and grid based, and compatible with drag and drop content editors like page builder of visual composer
      • good options should allow to define default behaviour for all custom options within pages or posts 'see second pargraph below)
      • color schema should be easy to customize : ideally you should show off a dozen color schemas with your theme
  • Menus 
    • handling a main menu - with unlimited hierarchy levels and responsivness -  is the minimum for a good theme, but I suggest your prepare other locations for secondary menus : top menu (for social networks), bottom menu (adress, legal ...)
  • Custom post types
  • Handling custom Font
    • it is necessary to provide som e sort of easy font customizing, either in the code via a filter or action, or via backend admin interface
    • icons : the font awesome library provides more than 300 hundred icons, it is quite necessary to provide this iconset within your theme. It is good to provide tinymce integration for quick icon integration within text
  • Custom options for pages :
    • custom box for choice of sidebar display :
      • custom sidebar selection (the free plugin Custom Sidebars is available for this feature if you don't want to implement it in your theme. But it does not allow you to remove a sidebar from a page)
      • sidebar position (right, left, none, both)

WordPress 4.0 ready for long texts

I was working on long texts this morning on wordpress tinuymce, that was in a 3.9 version : a big part of the work was scrolling forth and back from the bottom of my text and the tool bar. Moreover, I was switching from safari to Chrome to find out that Chrome allows resizing while Safari does not : small details, big trouble for writing on wordpress.

A big progress came with my 4.0 update : event though the resizing corner has disapeared on chrome, the editor now adapts to your content, and the toolbar stays on top of the screen instead of scrolling up with the page. For tinuymceadvanced users, make sure you have upgraded your plugin if you want this new content editing feature to work !

 

 

free drag and drop page builders for wordpress

whoever has tried visual composer from code canyon should be enthousiastic about the future of wordpress as a full featured content management system.

while there are many licensed (paid) drag and drop plugins for worpdress page editor, we have found one free alternative that does the job quite well

  • Page Builder by SiteOrigin has the big advantage of relying on widgets, a de facto standard for element contents in wordpress. It also comes with a very efficient column handler which does not limit you to a fixed width ! also comes with default widgets, very efficient :
    • Gallery widget for inserting image galleries, overrides default gallery system
    • Image widget for inserting standard images.
    • Self hosted video widget for embedding your own videos.
    • Post Loop to display a list of posts. 
  • little drawback of page builder is that it does not display the content within the blocks :
    wordpress-drag-drop

Other solutions i have not tested yet

Apart from free plugins, I have also tested commercial plugins like Visual Composer, which now comes with front end editing, have a look at my previous article on this subject

 

Information management with WORDPRESS / PART II : bulk editing

While comparing wordpress woocommerce with magento, I pointed out the very efficient bulk editing feature for products in magento : it's quite amazing to find out that new versions of wordpress bring features you would not even imagine. Version 2.7 of wordpress, brought to the world in december 2008, brought the famous Batch and inline editing, also known as BULK EDITING. Our main interest of bulk editing in wordpress for information management is the bulk editing of tags and categories. Codex mentions fields that can be bulk edited.

Bulk Edit allows the fields, Author, Comments Allowed, Status, Pings Allowed, and Sticky, to be changed for all the selected Posts

Limitations : wordpress codex highlights the fact that Categories and Tags can be ADDED in bulk to a set of Posts, but it is not possible to CHANGE, or DELETE, a Category, or Tag, for those Posts.

the delete category feature is an important issue, as moving products, posts, or other elements does involve adding categories but obviously you'd need to remove categories from posts : this was the subject of a discussion topic on wordpress forum where some piece of code was posted : read Remove Categories with bulk edit to find this piece of code that could be transformed into a plugin or simply added to your theme.

Woocommerce extra bulk edit

woocommerce plugin is a perfect exemple of the extensibility of the bulk editing feature : price information (% increase or decrease), sale information,status, weight and stock information can be bulk edited. developers will find interesting coding information for adding extra fields to the bulk editing feature in woocommerce codebase.

worpress-woocommerce-bulk-edit

 

 

Other extensions and plugins

for coders

for non coders

Information management with wordpress : POSTS

WORDPRESS INFORMATION MANAGEMENT -

PART 1 : POSTS

Basic information structure   in wordpress

All information in wordpress is stored as “post”. Each post shares specific information :

  • id : unique numeric (integer) identifier
  • creation and modification date
  • author
  • title
  • status (publish / draft / private)
  • post name : unique literal identifier
  • post type

POST TYPE

Default types of posts - Codex source http://codex.wordpress.org/Post_Types

  • wordpress articles
    • use for temporary dated  information / blog articles / news or press review
  • wordpress pages
    • use for presentation information, atemporal information, non related to specific time
  • wordpress attachment : images, pdf
  • wordpress menu entry
  • worpdress post revision

Custom post types

  • wordpress custom post type allow creation via code or plugins of specific information blocks : imagine any type of data store, it can be done by custom post types : products, movie database, book database, glossary...

CLASSIFICATION

all posts can be grouped, or classified, via taxonomies : categories or tags by default, custom taxonomies by extensioninformation-management-wp-book1

enhance admin

3 plugins to enhance admin columns in wordpress

  • https://wordpress.org/plugins/codepress-admin-columns/
  • https://wordpress.org/plugins/media-library-assistant/
  • https://wordpress.org/plugins/admin-management-xtended/

Delete taxonomy terms of a specific level or superior

I had produced a code that automatically creates taxonomy terms when visitors visit my web site : i found out that thousands of terms had been created , cloaking my database. only solution was to use the following code to automatically delete terms of level >1

 

set_time_limit(0);
 error_reporting(E_ERROR | E_WARNING | E_PARSE);

  function myErrorHandler($errno, $errstr, $errfile, $errline) {
    echo "<br>error" . $errstr . $errfile;
    return true;
  }
if (!strstr($_SERVER["SERVER_NAME"],"cadiou")) exit();
  //$old_error_handler = set_error_handler("myErrorHandler");
require( './wp-load.php' ); 

$tax_name = 'gamme';
$terms = get_terms( $tax_name );
function sort_terms_hierarchicaly(Array &$cats, Array &$into, $parentId = 0, $level=0)
{
    foreach ($cats as $i => $cat) {
        if ($cat->parent == $parentId) {
            $into[$cat->term_id] = $cat;
			echo"<br> $level ".str_repeat(" - " ,$level) . $cat->term_id . " : " .  $cat->slug;
			if ($level>1) wp_delete_term($cat->term_id, "gamme");
            unset($cats[$i]);
        }
    }

    foreach ($into as $topCat) {
        $topCat->children = array();
        sort_terms_hierarchicaly($cats, $topCat->children, $topCat->term_id, $level++);
    }
}$categories = get_terms('gamme', array('hide_empty' => false));
$categoryHierarchy = array();
sort_terms_hierarchicaly($categories, $categoryHierarchy);

 

Woocommerce BACS GATEWAY : display bank account info on order page

default woocommerce order page suffers on major drawback, it does not display bank account info for customers who have chose to pay via BACS  (Bank Account Clearing System), more commonly known as direct bank/wire transfer. This payment method comes integrated within standard woocommerce plugin (more info). The bank account number can be configured in the payment config area of woocommerce, and it is displayed on the confirmation page. But not on the order page that the customer can view any time after the order. Here is a piece of code that displays specific bank transfer information  at the bottom of  the order display page :

 

add_action('woocommerce_view_order','po201407view_order');

function po201407view_order($order_id)
{
 echo $order_id;
 $order=new WC_Order( $order_id );
  if ( $order->payment_method !== 'bacs') return;
	//echo $order->payment_method_title;
	$bacs = new WC_Gateway_BACS();
	//print_r( $bacs->account_details);
	  $bacs->thankyou_page( $order_id);
}

 

Dreamweaver vs sublime FTP

I don't mind paying for a good editor when it serves its purpose. I've tested quite a few, including php nusphere on windows. On MAc I have Sublime but I find the lack of develpment frustrating when some basic features like FTP are still limited to 10 sites !!

 

So I renewed my adobe cloud subscription and am currently tryin to get alon gwith dreamweaver, my old friend. It has a few things I can't find though :

  • comment code from shortcut (on sublime antislash did the job perfectly on css and php)
  • remember project opend files

n the other sied, dreamweaver has a very good free specific wordpress code hinting addon : https://creative.adobe.com/addons/products/392#.U47gwZR_unY

WordPress media library : display image size

I found with great disapointment that my new mac book does not always display image sizes in finder, little goodie that windows does perfectly. Well I don't exactly like the mac/ pc debate and turned to wordpress media library with a little code snippet that displays  a new column with image dimensions, found on the great stackexchange. Good candidate for basic wordpress extension.

add_filter('manage_upload_columns', 'size_column_register');

function size_column_register($columns) {

    $columns['dimensions'] = 'Dimensions';

    return $columns;
}

add_action('manage_media_custom_column', 'size_column_display', 10, 2);

function size_column_display($column_name, $post_id) {

    if( 'dimensions' != $column_name || !wp_attachment_is_image($post_id))
        return;

    list($url, $width, $height) = wp_get_attachment_image_src($post_id, 'full');

    echo esc_html("{$width}&times;{$height}");
}

 

Magento and WordPress integration : custom connection solution

Wordpress has various mega menu possibilities that we integrated in magento

WordPress has various mega menu possibilities that we integrated in magento

Lately we were comparing   ecommerce solutions that we have experienced in various projects : Magento for big and expensive projects versus woocommerce for smaller projects that are bound to expand. A big advantage of wordpress is that it integrates powerful content management and powerful ecommerce solutions within the same platform. And in some cases, Magento solution for e-commerce integrated with wordpress for content management can be the very good solution that takes the best of both worlds.

Today we review solutions that allow reciprocal integration of data between wordpress and Magento.

Basic wordpress content into magento

installing magento extensions require some expertise but is worth the time spent. Integrating wordpress posts into magento pages is easy with the  Magento WordPress Integration extension that fits worpdress post list and content within magento templates.

 

Global WordPress Magento integration : custom solutions

  • First, you must consider installation on the same server, sharing stylesheets and body elements to have consistency across the whole site : before choosing magento template and wordpress theme, bear in mind that stylesheets and javascript from both themes will be shared.
  • Next step consists of taking wordpress theme elements and sending them to a cache folder for integration in to Magento. We propose to integrate following wordpress elements in Magento
    • Main wordpress menu integration into Magento
    • Widgets elements (footer, sidebar)
    • latest articles

Locomotive CMS

I liked the look and design of a french travel agency website, http://www.doublesens.fr/ : a quick investigation into the inner engine that powers the simple layout , clean drop down menu and wift responsivness led me to LOCOMOTIVE CMS a promising new CMS built on rails and specialized on custom post types. Its website features a nice comparison with best in the world WORDPRESS CMS. One thing is would need though  a good image uploader like wordpress knows !