Upgrading Artisteer to Version 3 part 7

In part two we added three Menu Locations, and said we will be using the other two later in the series, for our third menu we are going to add the Vertical Menu Widget, this will be a single instance vertical menu and will inherit the styles and collapse functions of the  Artisteer widget.

In part one we looked at creating a child theme for an existing Artisteer theme, in part two we added the changes in WordPress version 3 for menu functions, in part three another nice little function is the new backgrounds, WordPress has a lot more header support and applying these changes from the admin panel in part four and part five we extended the header section, part six was the second horizontal navigation in this last part we are adding a vertical widget.

You can download the example Parent theme Here : Example 2.4 Theme (2427)

You can download the example Child theme part 2-7 Here: Artisteer Theme Upgrade Part 2-7 (1249)

If you have been following this series of tutorials you will have your child theme, download the Child Theme part 2-7 file and replace the file called functions.php.

We cannot say how easy it is working with child themes, download the files create a local install and look at how easy it was to upgrade this theme without changing a single line in the parent, however we understand that some will prefer editing the themes, so we will follow this post with a simple single upgrade file and one line of code.

What we have done for now is stil carry on with the child theme, our vertical widget menu is use some of the code from the Artisteer theme, changed some of the code generated by WordPress as there were validation errors, added the active attribute, added code for levels and show children, the menu will collapse just like the Artisteer widget.

This has been the most challanging and rewarding part of the series of posts, as Artisteer have quite of bit of code which has become redundant in this version, one nice feature was without changing any code in the parent we could disable the Artisteer redundant widget, in the setup function.

/* Start add Version 3 Vertical Menu Support from Digital Raindrops
    No longer require the Artisteer vertical menu  disable it */
 remove_action('widgets_init', 'widget_verticalmenu_init');

In the functions.php we have added these lines to display our Vertical Menu Widget, it might not be the best formatted code but it is functional and works at all levels, we could have left it as a simple non collapse menu but decided to try and mimic the Artisteer 2.4 widget, this is the code we are not going into detail on what each part does.

/* Start add Version 3 Vertical Menu Support from Digital Raindrops */
function cms_widget_verticalmenu($args) {
 /* Start these are the menu parameters load the menu with these artisteer ones */
 $defaults = array(
  'fallback_cb'  => '',
  'depth'    => 0,
  'echo'    => 0,
  'theme_location' => 'tertiary',
  'link_before' => '<span></span><span></span><span>',
  'link_after' => '</span>'
 // Get the WordPress Menu
 $menuitems = wp_nav_menu($defaults);
 // Nothing returned get out
 if (!$menuitems) return;
 // Remove the container div
 $pos = strpos($menuitems, '<li');
 $menuitems = substr($menuitems,$pos);
 $menuitems = str_replace( '</div>', '', $menuitems);
 // Change the sub menu div class name
 $menuitems = str_replace( 'sub-menu','children', $menuitems);
 //change the id to a class
 $menuitems = str_replace('id="menu-item-','class="page_item page-item-', $menuitems);
 $menuitems = str_replace('"n",$menuitems);
 //variables to use fo hide show menu
 $simple = $artThemeSettings['vmenu.simple'];
 $showchildren = $simple;
 /* loop through and create the Artisteer menu items */
 foreach ($templist as $value){
  if ($str) {
   // Open child menu unordered List
   $pos = strpos($str, '<ul class');
   if ($pos===0) {
    if ($showchildren) $menulist = $menulist .$value ."n";
   // Close child menu unordered list
   $pos = strpos($str, '</ul>');
   if ($pos===0) {
    if ($showchildren) $menulist = $menulist .$value ."n";
   // Close child menu list item
   $pos = strpos($str, '</li>');
   if ($pos===0) {
    if ($showchildren) $menulist = $menulist .$value."n";
   // menu item build the string
   $pos = strpos($str, '<li');
   if ($pos===0) {
    //restore indentation
    $str = $value;
    $pos = strpos($value, '<li');
    $str = str_replace('current_page_item"><a', 'current_page_item"><a  ', $str);
    $str = str_replace('current_page_ancestor"><a', 'current_page_ancestor"><a ', $str);
    // Child Level
    if ($menulevel > 0){
     $str = str_replace('<span></span><span></span><span>', '', $str);
     $str = str_replace('</span>', '', $str);
    if ($menulevel === 0) $showchildren = $simple;
    if(strpos($str,'current_page_ancestor') || strpos($str,'current_page_parent') || strpos($str,'current_page_item')) $showchildren = true;
    $additem = false;
    if ($menulevel === 0 || $showchildren) $additem = true;
    if ($additem){
     $menulist = $menulist .$str ."n";

 // Artisteer stuff from functions
 global $artThemeSettings;
 $bw = "<div class="art-vmenublock">rn    <div class="art-vmenublock-body">rn";
 $bwt = "<div class="art-vmenublockheader">rn    <div class="l"></div>rn    <div class="r"></div>rn     <div class="t">";
 $ewt = "</div>rn</div>rn";
 $bwc = "<div class="art-vmenublockcontent">rn    <div class="art-vmenublockcontent-body">rn<!-- block-content -->rn";
 $ewc = "rn<!-- /block-content -->rnrn  <div class="cleared"></div>rn    </div>rn</div>rn";
 $ew = "rn  <div class="cleared"></div>rn    </div>rn</div>rn";
 echo $bw;
 if ('' != $bwt && '' != $ewt) {
  echo $bwt;
  _e($artThemeSettings['vmenu.source'], 'kubrick');
  echo $ewt;
 echo $bwc;
 echo "<ul class="art-vmenu">n";
 echo $menulist;
 echo $ewc;
 echo $ew;

function cms_widget_verticalmenu_init() {
 if ( !function_exists('register_sidebar_widget') ) return;
 register_sidebar_widget(array('Vertical Nav Menu', 'widgets'), 'cms_widget_verticalmenu');
add_action('widgets_init', 'cms_widget_verticalmenu_init');
/* End add Version 3 Vertical Menu Support from Digital Raindrops */

Now we can visit the admin panel create and assign values to the vertical menu, for our example we are just going to create a new menu called Vertical and add some menu page items, then assign the new menu to the Theme Locations item Widget Vertical Menu.

Next we visit the theme widgets and drag the new widget to the sidebar.

Now when we visit the website the vertical menu is active.

Now we can have custom Vertical Menus in our Legacy Artisteer theme, this is only a simple single instance menu and we would love to hear back from you with any multi level working examples that you would like to share.


Code Samples:  Artisteer Generated Theme


Note: we do require your feedback to improve our themes and tutorials, please leave your comments good or bad.

Code disclaimer information
This document contains programming examples therefore, www.DigitalRaindrops.net grants you a nonexclusive copyright license to use all programming code examples from which you can generate similar function tailored to your own specific needs.

All sample code is provided by www.DigitalRaindrops.net for learning illustrative purposes only.

These examples have not been thoroughly tested under all conditions. www.DigitalRaindrops.net, therefore, cannot guarantee or imply reliability, serviceability, or function of these examples.

All programs contained herein are provided to you “AS IS” without any warranties of any kind. The implied warranties of non-infringement, merchantability and fitness for a particular purpose are expressly disclaimed.


We hope you will benefit from our tutorials Membership to this website is not required, however the downloading of some themes and files is restricted to site supporters.

You can register for a 10 year ‘Free Supporters Account’ from the members page which will give you access to the source files and free themes, as we introduce premium themes and content some of these these will only be downloadable with a subscription, any revenue from subscriptions is used to support the site costs.

This website is a tool to support and promote WordPress and Artisteer, please support, share and give credit for any benefits you gain from the tutorials on this website.

One thought on “Upgrading Artisteer to Version 3 part 7

Leave a Reply


Connect with Us
Follow Digital Raindrops on Twitter Join Digital Raindrops on Facebook

Related Posts

Posted in Migration


To much information and still finding it a bit scary, lets us make it very easy, this quick guide is all the code changes except the styling, there are only three code block to do honest, first we need to find the header.jpg in … Continue reading

Read More