Customizing the Mystile theme Homepage

March 13, 2013 · 276 comments

in WooCommerce Tutorials, WP Theme Tutorials

Create Unique Homepage with Mystile theme

How to Customize the Homepage of the Mystile Theme

The Mystile theme is probably the most popular of the free themes built specifically for WooCommerce.  It’s a good option for people that are looking to create an eCommerce site but are not ready to invest in a premium theme.  Mystile also makes it easy to test and get familiar with the WooCommerce platform before going all-in.

With so many WordPress sites using Mystile it can be difficult to make your eCommerce site look unique.  Recently, many questions have been raised related to customizing the Homepage of the Mystile theme.  More specifically, folks are looking for an easy way to replace the static homepage banner image with an image slider.  The need for more control over the front page of the Mystile theme is priority number one for many people.

In this UploadWP.com tutorial we will show you how to make your Mystile theme eCommerce site stand out from the rest of the crowd.  Specifically, we’ll show you how to customize the homepage using a combination of SlideDeck 2 (content slider plugin) and WooCommerce shortcodes.  You’ll soon see that it’s possible to create a unique Homepage for the Mystile theme so lets get started….

Steps for Customizing the Mystile theme Home Page

Step 1:  Create “Home” and “Blog” page templates

When the Mystile theme is first activated it automatically creates a “Home” page link in the main navigation and it gives you a default homepage.  The issue is that when you log-into the WordPress admin and look for a “Home” page to edit you won’t find one.  Without a page to edit you have limited control over what displays when people go to the index page of your site.  So as the first step, we need to create our own Home and Blog page templates.

To create a new Homepage template in the WordPress admin go to…

Pages > Add New > title it “Home” > make the page template full width by selecting “Full Width” in the Template drop-down on the right-hand-side of your screen > publish the page

Create a Blog page template…

Go to Pages > Add New > title it “Blog” > set the page template to “Blog” > publish the page

Step 2:  Adjust the Reading setting to make the new “Home” page template the Front Page of the Site

Now that we’ve created our Home and Blog page templates, the next step is to adjust the “Reading” settings so that the new Home page template becomes the Front page / index page.  This will also result in our future posts displaying on the Blog page template.

To adjust the Reading settings in the WordPress admin do the following…

Go to Settings > Reading > for “Front page displays” select the “A static page” radio button > in the Front page drop-down select Home > in the Post page drop-down select Blog > Save Changes

Step 3:  Customize the new Homepage

After adjusting the Reading settings, the front page of your Mystile theme site will display the new Home page full width template and your future posts will display on the Blog page template.  It’s now time to customize your new Mystile Homepage.  In terms of customization you can really do whatever best fits your specific eCommerce site.  You’re only limited by the level of your creativity.  Personally, I like using an image slider to give the Homepage some life.  The image slider in the tutorial video below was created with the SlideDeck 2 plugin.  SlideDeck 2 makes it easy to create and insert responsive content sliders for any page of post on your WordPress site.customize mystile home page Customizing the Mystile theme Homepage

In addition to replacing the Mystile static homepage banner image with a SlideDeck content slider I recommend experimenting with WooCommerce shortcodes.  The shortcodes are built into the WordPress rich text editor.  Simply click the purple “Woo” icon to access the WooCommerce shortcodes and click the blue “Woo” icon to insert any of the WooThemes shortcodes.  With an image slider and shortcodes you can make your Home page exclusive.  Play around with it to find the layout that best fits your eCommerce site.

Step 4:  Control the Primary Navigation with Custom Menus

Now that you’ve created a custom Homepage it’s time to update the primary navigation via the use of custom menus.  By now you’ve most likely noticed that there are two “Home” links displaying in the navigation.  To get rid of the second “Home” link we need to create a custom menu.

In the WordPress admin go to Appearance > Menus > give the menu a name and click Create Menu > select your menu from the Primary Menu drop-down > in the Custom Links widget create a Home link and add it to the menu > in the Pages and Categories widgets select the additional pages and/or categories that you want in the primary navigation > Save your custom menu

The important thing to stress when creating your primary navigation menu is that the “Home” link must be created in the Custom Links widget.  Do not select the Home check-box from the Pages widget, it must be created as a Custom link.  All other Pages and/or Categories can be selected via the check-boxes.

Step 5:  Prevent the “Home” title from Displaying

The final step in this process of creating a unique Mystile theme Homepage is to prevent the “Home” title from displaying.

In the WP admin go to Pages > Home > delete the page title > update the page

For your reference:

  • The demo site used in the tutorial video below is…  SportTees.info
  • The image slider was created with the SlideDeck 2 plugin.  SlideDeck is a premium content slider plugin.  We are in the process of creating an in-depth tutorial series on SlideDeck 2.  It is important to note that most other image slider plugins (including The Fly Image Slider) would work as well.
  • Dimensions for the image slider used in this tutorial video:  1060px x 343px
  • Make sure that the image slider used is responsive.
  • Although we used the Mystile theme in this tutorial, this process should work with almost any WooCommerce theme.

Customizing Mystile theme Part 2 – How to Remove the Mystile theme main Navigation and Replace it with a custom top right Widget Section

Part two of this tutorial was inspired by a question from one of our loyal UploadWP.com subscribers.  BruceDeutsch asked (via a comment below) if it was possible to remove the standard navigation and we felt is was worth elaborating on.  Thanks to BruceDeutsch, you’ll now learn how to remove the Mystile theme main navigation and replace it with a Top Right widget section.

Step 1:  Install a Mystile child theme and in the WordPress admin do the following…

Go to Appearance > Editor > in the style sheet paste the following custom CSS and update the file

#topright {
    float: right;
	width: 50%;
	text-align: right;
}

Here’s a screen capture of where you should paste the CSS in style.css

mystile topright float right Customizing the Mystile theme Homepage

Step 2:  Open the Theme Functions file (functions.php) and paste the following PHP…

remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering', 30 );

Below is a screen capture that illustrates exactly where to paste it in the functions.php file

mystile child theme functions Customizing the Mystile theme Homepage

Step 3:  Create a header.php file and add it to the Mystile child theme.

Next, you need to add a header.php file to your child theme and we’ll do that by opening Notepad++ and pasting in the following code…

<?php
// File Security Check
if ( ! empty( $_SERVER['SCRIPT_FILENAME'] ) && basename( __FILE__ ) == basename( $_SERVER['SCRIPT_FILENAME'] ) ) {
    die ( 'You do not have sufficient permissions to access this page!' );
}
?>
<?php
/**
 * Header Template
 *
 * Here we setup all logic and XHTML that is required for the header section of all screens.
 *
 * @package WooFramework
 * @subpackage Template
 */
 
 global $woo_options, $woocommerce;
 
?><!DOCTYPE html>
<html <?php language_attributes(); ?> class="<?php if ( $woo_options['woo_boxed_layout'] == 'true' ) echo 'boxed'; ?> <?php if (!class_exists('woocommerce')) echo 'woocommerce-deactivated'; ?>">
<head>

<meta charset="<?php bloginfo( 'charset' ); ?>" />

<title><?php woo_title(''); ?></title>
<?php woo_meta(); ?>
<link rel="stylesheet" type="text/css" href="<?php bloginfo( 'stylesheet_url' ); ?>" media="screen" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php
    wp_head();
	woo_head();
?>

</head>

<body <?php body_class(); ?>>
<?php woo_top(); ?>

<div id="wrapper">

	

	<div id="top">
		<nav class="col-full" role="navigation">
			<?php if ( function_exists( 'has_nav_menu' ) && has_nav_menu( 'top-menu' ) ) { ?>
			<?php wp_nav_menu( array( 'depth' => 6, 'sort_column' => 'menu_order', 'container' => 'ul', 'menu_id' => 'top-nav', 'menu_class' => 'nav fl', 'theme_location' => 'top-menu' ) ); ?>
			<?php } ?>
			<?php
				if ( class_exists( 'woocommerce' ) ) { 
					echo '<ul class="nav wc-nav">';
					echo '<li class="cart">'.current(woocommerce_cart_link()).'</li>';
					echo '<li class="checkout"><a href="'.esc_url($woocommerce->cart->get_checkout_url()).'">'.__('Checkout','woothemes').'</a></li>';
					echo get_search_form();
					echo '</ul>';
				}
			?>
		</nav>
	</div><!-- /#top -->

   
    
    <?php woo_header_before(); ?>

	<header id="header" class="col-full">
			  
	   
	    
	    <hgroup>
	    	
	    	 <?php
			    $logo = esc_url( get_template_directory_uri() . '/images/logo.png' );
				if ( isset( $woo_options['woo_logo'] ) && $woo_options['woo_logo'] != '' ) { $logo = $woo_options['woo_logo']; }
				if ( isset( $woo_options['woo_logo'] ) && $woo_options['woo_logo'] != '' && is_ssl() ) { $logo = preg_replace("/^http:/", "https:", $woo_options['woo_logo']); }
			?>
			<?php if ( ! isset( $woo_options['woo_texttitle'] ) || $woo_options['woo_texttitle'] != 'true' ) { ?>
			    <a id="logo" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php esc_attr( get_bloginfo( 'description' ) ); ?>">
			    	<img src="<?php echo $logo; ?>" alt="<?php esc_attr( get_bloginfo( 'name' ) ); ?>" />
			    </a>
		    <?php } ?>
	        
			<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></h1>
			<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
			<h3 class="nav-toggle"><a href="#navigation">&#9776; <span><?php _e('Navigation', 'woothemes'); ?></span></a></h3>
		      	
		</hgroup>
        
        <?php woo_nav_before(); ?>

		<div id="topright"><?php woo_sidebar( 'top-right' ); ?></div>
		
		<?php woo_nav_after(); ?>
	
	</header><!-- /#header -->
		
	<?php woo_content_before(); ?>

Save the file as, “header.php”

After the file has been saved in Notepad++ do the following…

Open Filezilla (any FTP client will work) and drop the header.php file into the Mystile child theme

Step 4:  The final step in the process of removing the main navigation and replacing it with a top right widget section is to create an “includes” directory in the child theme, make “sidebar-init.php” in Notepad++ and drop it into “includes”.

Copy the PHP below and paste it into Notepad++…

<?php
// File Security Check
if ( ! empty( $_SERVER['SCRIPT_FILENAME'] ) && basename( __FILE__ ) == basename( $_SERVER['SCRIPT_FILENAME'] ) ) {
    die ( 'You do not have sufficient permissions to access this page' );
}
?>
<?php

// Register widgetized areas

if (!function_exists( 'the_widgets_init')) {
    function the_widgets_init() {
		global $woo_options;
		
	    if ( !function_exists( 'register_sidebar') )
	    return;
	
	    register_sidebar(array( 'name' => 'Primary','id' => 'primary','description' => "Normal full width sidebar", 'before_widget' => '<div id="%1$s" class="widget %2$s">','after_widget' => '</div>','before_title' => '<h3>','after_title' => '</h3>'));
	    
	    // Footer sidebar
	    register_sidebar(array( 'name' => 'Footer 1','id' => 'footer-1', 'description' => "Widetized footer", 'before_widget' => '<div id="%1$s" class="widget %2$s">','after_widget' => '</div>','before_title' => '<h3>','after_title' => '</h3>'));
	    register_sidebar(array( 'name' => 'Footer 2','id' => 'footer-2', 'description' => "Widetized footer", 'before_widget' => '<div id="%1$s" class="widget %2$s">','after_widget' => '</div>','before_title' => '<h3>','after_title' => '</h3>'));
	    register_sidebar(array( 'name' => 'Footer 3','id' => 'footer-3', 'description' => "Widetized footer", 'before_widget' => '<div id="%1$s" class="widget %2$s">','after_widget' => '</div>','before_title' => '<h3>','after_title' => '</h3>'));
	    register_sidebar(array( 'name' => 'Footer 4','id' => 'footer-4', 'description' => "Widetized footer", 'before_widget' => '<div id="%1$s" class="widget %2$s">','after_widget' => '</div>','before_title' => '<h3>','after_title' => '</h3>'));		register_sidebar(array( 'name' => 'Top Right','id' => 'top-right', 'description' => "Top Right", 'before_widget' => '<div id="%1$s" class="widget %2$s">','after_widget' => '</div>','before_title' => '<h3>','after_title' => '</h3>'));
	}
}

add_action( 'init', 'the_widgets_init' );
    
?>

Save the file as, “sidebar-init.php”

After the file has been saved in Notepad++ open your FTP client, find the site you’re working on and go to:

wp-content > themes > Mystile Child > right click and select “create directory” > name the directory “includes” > drop the “sidebar-init.php” file into the newly created includes directory

create includes directory in mystile child theme Customizing the Mystile theme Homepage

Mission accomplished!  Go out to your site, refresh the page and the Mystile top navigation will no longer appear.  Next, go to Appearance > Widgets and you’ll see the custom “Top Right” widget section.  You can use the new widget section to more deeply customize your Mystile child theme.

For your reference:

  • Part 2 of customizing the Mystile theme was added on:  10/31/2013
  • The demo site used in part 2 is…  Sliderdemo.info
  • Notepad++ and Filezilla are free tools – just Google them
  • To get a free Mystile Child Theme, subscribe to the Upload WP Newsletter

Watch our tutorial video below to see exactly how to replace the Mystile theme main navigation with a custom top right widget section…

Please use the new Upload WP Community Forums to post questions and comments on Customizing the Mystile theme.  Thanks

Teddy Triton

Article by

I'm a blogger and the founder of UploadWP.com. Upload WP was originally created as a training tool for my Flippa.com clients. Having bought and sold a large number of WordPress sites on Flippa, I needed an effective and efficient way to teach people how to make updates to their new sites. Upload WP was the answer and the site has since grown into a leading WordPress Tutorials destination. I enjoy helping people solve their WordPress related issues. If you have any questions or a WP issues that you need help with, please leave a comment below and we'll do our best to help.

Adam has written 106 awesome articles for us at Upload WordPress

Stay Updated - Subscribe

{ 276 comments… read them below or add one }

Luck March 15, 2013 at 11:10 am

Hi Adam!
Great video as usual, thanks a lot for posting more mystile theme tutorial for us! I do have problems as always but I will ask you only one question for now since I know you must be busy to keep up with everybody else. My question is the home that show on my site at the top of slider, when I follow as your instruction I did have 2 home at that spot so I go into page and remove title page, it help to remove one of them but I do still have the other one on it, do you have any idea why it did that? It leaves a big gap between menu bar and slider. Thanks again for your help!
Regards,
Luck

Reply

Teddy Triton Teddy Triton March 16, 2013 at 3:22 pm

Hi Luck,

Thanks for the positive feedback and support! I took a look at your site and could not recreate the issue of 2 “Home” links in the navigation. I see one Home link which is I think what you want. If you do want to remove the remaining “home” link from the navigation then you can do that by creating a Custom Menu and not putting a Home link in the Primary Navigation custom menu.

Mystile theme showcase site

Please let me know if this helps answer your question.

Thanks,

Adam

Reply

Luck March 15, 2013 at 12:02 pm

Hi again,
I forgot to ask if I would like to switch to other paid theme, Do I need to redo all my work or I can transfer my design to new theme. Do you think it will be easier to work on paid theme with more features?
Thanks again!
Luck

Reply

Teddy Triton Teddy Triton March 16, 2013 at 3:52 pm

Hi Luck,

If you decided to switch over to a premium WooCommerce theme you will need to re-do some of the design. Your pages / products / posts will all still be there so in terms of functionality that should not be effected much, if at all. But depending on the premium theme you choose to go with, there will be design updates you’ll have to make. They are usually pretty basic but you will have to spend time on it.

I think you’ve done a really good job in terms of customizing the Mystile theme for your site, zenzame.com. At this point, I would focus more on continuing to build the site up with content and focus on getting more and more traffic to it. Keep building it up and let it mature for a while. You can switch it over to a premium theme at any time but you’ve done such a great job with it that in my opinion you can shift out of design mode and focus on traffic. Once the site starts to get steady traffic see how it converts. If you find a premium theme that you think will help convert the traffic into sales then at that time you can upgrade. But for now, the site looks really good and I would focus more on consistently adding original content and building up the organic traffic. Let me know if this helps.

Reply

Wendy March 16, 2013 at 12:12 pm

Hi there,

Is there a way to modify the position of both the logo navigation bar. I would like to centralize the logo to the page and move the nav bar from the right and keep it below the logo. Is that possible?

Thanks,
Wendy

Reply

Teddy Triton Teddy Triton March 21, 2013 at 4:11 pm

Hi Wendy,

To the best of my knowledge, I don’t think there is an easy way to modify the position of the logo and navigation bar for the Mystile theme. I believe it would require modifying php files. However, my guess is that you could go to a site like Fiverr.com and find a WordPress expert that would be able to make those changes for $5 / $10. So my suggestion would be to checkout Fiverr and see if you can find a WordPress gig that could make those changes for you. Thanks for your question and please let me know if this helps point you in the right direction.

Adam

Reply

Savidge4 February 11, 2014 at 12:48 am

#header hgroup {
float: none !important;
text-align: center;
}

#header #logo {
float: none;
}
Centers the logo atop the navigation

Reply

Teddy Triton Teddy Triton February 11, 2014 at 6:48 am

Thanks for sharing!

Reply

Bella March 20, 2014 at 11:22 am

Hi Savidge4,

how to make the logo center with these css code below?

#header {
padding: 0;
margin-bottom: 0;
border-bottom: 4px double #e8e4e3;
clear: both;
position: relative;

#navigation {
margin-bottom: 0;
clear: both;
}

Reply

Teddy Triton Teddy Triton March 20, 2014 at 6:08 pm

Hi Bella,

Please join the Upload WP Community Forums and post your question on centering the Mystile theme logo here… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

Thanks

Luck March 16, 2013 at 4:03 pm

Thanks Adam!
I think I can fix the problem that I ask you earlier already. It is the breadcrumb option that I have on, sorry about that!
As you can see my website, the product name under feature photos and recent photos look so big to me and I try to decrease the font size in Mystile typography, what it does is, it make the type on the rest of the page way too small, is there anyway to fix this? I also wonder if I can reduce the size of the featured photos and recent photos? I feel so bad to ask you so many question but you are the only helpful resource for me. Do yo have any suggest on book or website that I should look for so I won’t keep bugging you like this? thank you so much!

Reply

Dawn March 18, 2013 at 8:19 am

How do you remove the dots over the banner image in mystile? Someone suggested clearing the cache but that did not work. Thank you!

Reply

Teddy Triton Teddy Triton March 18, 2013 at 9:39 pm

Hi Dawn,

Thanks for your question in regards to removing the dots on the featured banner image on the home page of the Mystile theme. I just looked at your site, TibetanMala.com, and the homepage featured banner image looked clear. I did not see dots in the image. Were you able to find a solution or is it just my screen? If you did find a solution, please let us know. It will benefit many people who are looking for an answer to the same question.

Thanks,

Adam

Reply

Dan April 4, 2013 at 6:35 pm

Hi Teddy,

I’m having a total nightmare with my shopping cart. When you add a product, the cart doesn’t update until you click on the cart or checkout. Pretty confusing.

Any ideas?

Thanks.

Reply

Ali March 18, 2013 at 2:25 pm

Hi Teddy,

Thanks for this great tutorial, I was just wondering how can I add that Shop menu with categories on my page, I have been trying to sort this out from last two days but couldn’t.

Thanks,
Ali

Reply

Teddy Triton Teddy Triton March 18, 2013 at 9:02 pm

Hi Ali,

Thanks for the positive feedback in regards to our Mystile theme tutorials. I’m not sure I’m following your question regarding ” how to add the Shop menu with categories”… Are you referring to the 4 Product category images on the home page of our Mystile theme demo site SportTees.info?

Mystile homepage product categories

Please provide more information and I’ll do my best to help. Thanks,

Adam

Reply

Sophie April 2, 2013 at 7:12 pm

Hi I am so grateful for the tutorials. I am also getting the dots on the banner image. Any ideas?

Reply

Teddy Triton Teddy Triton April 2, 2013 at 8:52 pm

Hi Sophie,

Thanks for letting us know the tutorials have been helpful. I’m pretty sure that getting rid of the dots on the homepage banner image of the Mystile theme requires tweaking the css. I’ve not yet had a chance to look into what needs to be modified but if anyone else out there can chime in it would be greatly appreciated.

I will take a closer look at it tomorrow and see if I can find what needs to be modified. Thanks again for your support.

Reply

Sophie April 2, 2013 at 10:01 pm

Hey,

Thanks for the reply. I got it eventually. I first tried the Woodojo custom css/html then tried adding this:

.homepage-banner:after { display: none; }

to the custom css…refreshed the page…bingo.

Hope that works for others.

Thanks again.

Reply

Teddy Triton Teddy Triton April 3, 2013 at 3:18 pm

Thanks for sharing the solution with us Sophie! I’m sure this will help many people that have been trying to remove the dots on the homepage featured banner image of the Mystile theme. It’s much appreciated.

Adam

Reply

Teddy Triton Teddy Triton April 8, 2013 at 3:49 pm

Thanks again Sophie for your help on the Mystile banner image. We decided to shoot a quick video tutorial on removing the Mystile theme Homepage featured banner image dot overlay…

In your WordPress admin go to Mystile > Theme Options > Display Options and paste the following in the “Custom CSS” box…

.homepage-banner:after { display: none; }

Reply

Sophie April 22, 2013 at 4:34 pm

Great!

Pickles Chong April 5, 2013 at 11:33 pm

Thanks for your video tutorials. I found them very helpful in learning WP and Woocommerce. Currently, I am trying to set up an online store for my in-law using Wootique and Woocommerce. Thanks again.

Reply

Teddy Triton Teddy Triton April 6, 2013 at 6:55 pm

Thanks for letting us know that our WordPress tutorials have been helpful. If you have any questions or need help building your Wootique themed WooCommerce site please let us know. Thanks!

Adam

Reply

Daphne April 9, 2013 at 4:03 pm

Hello! I’m currently using Mystile for my upcoming online store: http://lovemetamorphosis.com

I’m having trouble with the Check out/Pay. I tested it and right after I click “Place Order” these commands show up:

{“result”:”failure”,”messages”:”
\n\t\t\t
Action failed. Please refresh the page and retry.\n\t\t\t
Sorry, your session has expired. Return to homepage →\n\t\t\t
Country is a required field.\n\t\t\t
First Name is a required field.\n\t\t\t
Last Name is a required field.\n\t\t\t
Address is a required field.\n\t\t\t
Town \/ City is a required field.\n\t\t\t
State \/ County is a required field.\n\t\t\t
Postcode \/ Zip is a required field.\n\t\t\t
Email Address is a required field.\n\t\t\t
Phone is a required field.\n\t”,”refresh”:”false”}

I typed in all the required information and they keep popping up. I’m pretty sure my Check out/Pay shortcodes are typed correctly. Please help. Thank you. :(

Reply

Teddy Triton Teddy Triton April 9, 2013 at 10:19 pm

Hi Daphne,

Thanks for your question. I took a quick look at your site and I’m getting “page not found” errors on most of the pages. I’m thinking it could be a permalinks issue or an issue with you hosting provider. I’d be happy to take a closer look if you use the contact form (link to contact page is in footer).

Reply

David April 10, 2013 at 6:46 pm

So glad I ran into your tutorials…so very helpful…

Is there a way to “turn off” the E-commerce/Cart part of the site? I want to just create a look book and for people to “contact us for more information” instead of the ability to actually order. Also removing the cart information on the top right hand side of the site.

If so, then I’d like to remove the main navigation area completely which will move the banner up.

I’m also having trouble changing the title of the products on both the products page and the individual product page itself.

Thanks again…
Also thanks for Fiverr.com…never heard of that service. Trying out someone to create a banner for me…

All the best,
David

Reply

Teddy Triton Teddy Triton April 15, 2013 at 9:10 pm

Hi David – I’m happy to hear that you’ve found our WooCommerce tutorials to be helpful. I believe you could hide the main navigation completely via the use of the PageMash plugin. PageMash is a free plugin that allows you to control the pages / categories that show in your navigation.

Or, simply install the Mystile theme but not the WooCommerce plugin. Use Mystile as a stand-alone theme, no eCommerce functionality. Feature you products as simple blog posts. That will disable the eCommerce functionality all together.

Please let me know if this helps.

Reply

Teddy Triton Teddy Triton December 9, 2013 at 4:04 pm

Hi David,

We just published a list of WooCommerce ready themes. Many of the themes in the list have an optional "Catalog mode" built in which would allow you to remove the Add to Cart and Price functionality. Here's the link to view our list…

http://uploadwp.com/woocommerce-themes/

Reply

Cleo April 11, 2013 at 4:01 pm

Hi Adam

Thank you so much for all the great resources available here. I found a ton of answers already.

I hoped you could help me work out how to adjust some of the layout in my Mystile theme.
1)I would like to reduce the space between the Customized Header I have uploaded and the Primary Naviagation menu
and also to reduce the space between that same Naviagation menu and my banner?

2)Is there a way to lose the background to my site? The main body of my site is surrounded by a grey background that I don’t want or need.

I realize this probably means adding some code, but I’m not sure where to start.

Any help much appreciated

Thanks

Cleo

Reply

Teddy Triton Teddy Triton April 15, 2013 at 8:58 pm

Hi Cleo – Thanks for your support and positive feedback – it’s very much appreciated! I’m not sure of the exact custom css required to make the tweaks that you’re looking for but I’ll go ahead and publish this comment with the hope that our WooCommerce community will chime in with suggestions. Thanks again for the encouragement.

Adam

Reply

Vimala April 12, 2013 at 8:31 am

Hi there – Thank you for your tutorial. I’ve been having trouble with the Banner/Header image and Background image displaying on Mystile. I upload the same images that I used with my previous themes (Twenty Ten and Fruit Shake on Wordpress.com), I save it (it gives me the Options Updated + green check), then when I refresh my website, nothing. I’m not going to use a logo image, but I followed instructions from your tutorial to upload that and was able to get it to display. I also tried the custom CSS you recommend above to get rid of dots, but no luck with that either.

Any ideas? Thanks!
Vimala

Reply

Teddy Triton Teddy Triton April 12, 2013 at 2:57 pm

Hi Vimala,

Thanks for your questions regarding the Mystile theme. Have you had a chance to check out our video on, “Uploading a Custom Logo and Featured Banner Image to the Mystile theme”? If not, please take a couple minutes to check it out because it should help point you in the right direction…

Please let me know if this helps solve the issue. Thanks,

Adam

Reply

Grazina August 10, 2013 at 11:40 pm

Adam,
thanks for a great tutorial, it solved my problem with the logo not showing (I had the text box ticked).

Another problem is that the banner is not showing – I can see the featured image on the Homepage in Options, click on save changes – nothing. What am I doing wrong?

And the shortcuts don't show in the kitchen. :)

Help!

Reply

Teddy Triton Teddy Triton August 11, 2013 at 4:37 pm

Hi Grazina,

I'm glad to hear that our tutorials have been helpful. To get the featured banner image to show on the homepage of the Mystile theme do the following…

In the WordPress admin go to Mystile > Theme Options > Homepage > make sure the "Display a banner on the homepage?" check box is selected > upload your image > make sure to delete any text in the "Banner headline" and "Banner stand first" text boxes > Save all changes and your banner will show on the homepage of your site.

Just make sure to do a Ctrl F5 to refresh the page. You might also have to clear your browsers cache to see the changes.

Reply

Grazina August 11, 2013 at 9:07 pm

Adam, thanks for your lightning fast reply, I guess you have other things to do, too so I really appreciate your help:)

I did everything once more as you described – nope, the banner still doesn't show. I checked in another browser – Maxthon – and it doesn't show either. And I cleared the cache.

There's one thing that may cause the problem: when I came back to the Mystile > Theme Options > Homepage after I uploaded the banner and deleted text from both windows, and went to see the page – the banner shows but the "Welcome to our store" and the other text are back. And I definitely deleted them and clicked on the "Save all changes".

By the way, there are two "Save all changes" boxes, one above, and one below the Featured Image area – that's a bit confusing.

And my question about the shortcodes? The purple and blue icons? There nothing in my kitchen sink apart from the editor's icons.

Megan Wage December 12, 2013 at 9:03 pm

I did the following several times: Mystile > Theme Options > Homepage > make sure the "Display a banner on the homepage?" check box is selected > upload your image > make sure to delete any text in the "Banner headline" and "Banner stand first" text boxes > Save all changes and your banner will show on the homepage of your site.

There is still no banner showing up on my page. I also tried adding .homepage-banner:after { display: none; } to the CSS and still nothing. Any help?

murray April 15, 2013 at 7:18 am

I’m wondering how to remove the drop-down sort order button on the shop page, I don’t have many products and want to comment it out. Anyone know where to do it?
Thanks

Reply

Teddy Triton Teddy Triton May 15, 2013 at 1:26 pm

Hi Murray,

We created a tutorial video that demonstrates how to remove the Sort Order Drop-Down on the WooCommerce Shop page. Here is is…

Reply

Collin April 16, 2013 at 2:16 am

When I upload a background image it only appears if I select the “Wrap your site content inside a frame.” checkbox in the layout options. When I do this however I get about 1/2″ of background image around the content. How can I shrink the width of that boxed content to show more of the background image? There is a lot of wasted width that is not being used by my “full-width” template.

Thanks,
Collin

Reply

Mark May 13, 2013 at 12:39 pm

hey, I too am interested in re sizing this area, there is a lot of wasted space in the content area and not much of the background image is seen. Has anyone figured out where to make the edit for this in the code?

Reply

Michael April 17, 2013 at 2:11 pm

Hi Teddy (Adam?)
I’ve been engrossed in your WooCommerce videos and now with the MyStile theme ones. Great job and such a generous use of your time and extensive knowledge.
My problem is trying to get my pictures to display in the correct siz e(book cover type pics) for both Featured and Product images. I’ve looked at: setting img width to inherit in the CSS (2 places); changed MyStile > Theme Options > Dynamic Images > Thumbnail Settings; and when I change the Settings > Media images sizes. Nothing happens with either change.
Your time and brain power to what is probably a simple problem would be gratefully received.
Cheers. Michael

Reply

Lisa April 23, 2013 at 5:12 pm

Hi Adam, thanks so much for this tutorial! I´ve been struggling with this double ´home´ button for days until i stumled upon this page. So again thank you! Greetings from The Netherlands! Lisa

Reply

Teddy Triton Teddy Triton April 25, 2013 at 6:00 pm

Hi Lisa, Thanks for letting me know it was helpful and for the positive feedback! Your support is greatly appreciated. Adam

Reply

Laverne April 27, 2013 at 9:47 am

Thanks for the tip on removing dots!!!! Also on sizing too helped loads. Do you have tutorial on setting up widgets and the different menus?

Reply

Teddy Triton Teddy Triton April 27, 2013 at 10:29 am

Hi Laverne,

Thanks for letting us know that our tutorial on removing the dots from the Mystile theme homepage featured image helped. We do a have a few tutorials that touch on setting up WooCommerce widgets and custom menus. Although a couple of them are not specific to the Mystile theme, they should still apply for the most part.

WooCommerce Widgets Tutorial

Custom Sidebars

Control the Primary Navigation with Custom Menus

Thanks again for the positive feedback!

Reply

Jayanath May 5, 2013 at 10:10 am

Hi,
I’m from Sri Lanka. Thanks a lot for your tutorial. It helped me to remove banner dots. Thanks a lot. Cheers

Reply

Mandy April 28, 2013 at 6:58 am

Hi Adam,
Thanks for the very helpful tutorials. They have helped me with little problems I didn’t even know I had which is great. However I have been trying to deal with 2 issues that I haven’t been able to figure out. The first one is on how to add multiple images to a product. I’ve done the following which is gone to edit product>add media>upload images> X the window> Update page and gone back to the product page and had no success. Second issue is that the product image comes up quite blurry and wanted to know if the product image had a specific size that it needed to be for it to come up clear? It comes up clear in the edit page but not on the website itself. Any insights would be appreciated. Thanks in advance :)
-Mandy-

Reply

Guru April 30, 2013 at 10:37 am

Hi Adam,

Thanks for this tutorial. It was very useful for me as I am new to WordPress and woocommerce. Just started with your tutorial for changing mystile theme. Can you design a woocommerce theme from scratch?

I want to change the navigation bar, categories and footer background image.

Thanks

Reply

Rachel Brownstein May 6, 2013 at 7:39 pm

Hi there,

Loving how easy it is to understand and follow your tutorial!

I’m having a brain fart I hope you can help with. I’ve created the Product Categories shortcode but no images are showing. Where do I change this?

Many thanks in advance!

Reply

Teddy Triton Teddy Triton May 8, 2013 at 2:06 pm

Hi Rachel,

I’m glad to hear our WooCommerce tutorials are easy to follow. Thanks for the positive encouragement! You can add/edit product category images by dong the following…

In the WordPress admin go to Products > Categories > click “Edit” on the categories > on the “Edit Product Category” page you’ll be able to upload your product category thumbnail image at the bottom of the screen as illustrated in the screen shots below…

Edit WooCommerce Product Categories

add an image to WooCommerce Product Category

Let me know if this helps answer your question and thanks again for your support.

Adam

Reply

Rachel Brownstein May 13, 2013 at 2:26 pm

Thanks very much Adam!

Reply

Jayanath May 13, 2013 at 1:16 pm

Dear Adam,
It’s a lovely tutorial. Got many things out of it. Can you please tell me how to change background white colour of mystile theme. Thanks a lot

Reply

Dydy May 14, 2013 at 6:54 am

Hi Adam,

Great tutorials. You’ve helped building a website a whole lot easier for me so thanks!

I am using the mystile theme for my online shop and am having an issue with my product thumbnail size. The images that appear underneath my featured image are coming up too small. The size comes up about the size of this box [ ] and I want it to be at least double the size. Is there anywhere I can change this?

Thanks!

Reply

Teddy Triton Teddy Triton May 15, 2013 at 11:06 am

Hi Dydy,

Thanks for the complements! I’m glad to hear that our WooCommerce tutorials have been helpful.

In regards to the issue with product thumbnail images… Are you referring to the Featured Products and Recent Products located on the Mystile theme homepage under the Featured Banner image as highlighted in the screen shot below?

Mystile Homepage Product Images

If so, you’re saying that your product images are much smaller than the ones in the screen shot above? Please provide more info / be more specific and I’ll do my best to help. Thanks,

Adam

Reply

mat May 18, 2013 at 7:10 pm

Whatever size of image I upload as a featured image Mystile will create a 300×300 version and blow it up to 511×510 on the product page. Consequently all my featured images look terrible. Does anyone know what the solution is?

Thanks,

Mat,

Reply

Michael July 8, 2013 at 12:33 pm

Hi Mat,

Im having similar issues with my featured images. Have you found a solution or can anyone take a look at my images and advise??
http://www.livincoffee.com

Thanks v much -
Michael

Reply

Brooke August 24, 2013 at 8:59 pm

Same here, it seems the featured image uses a 300×300 & stretches it to fit the 511×510 space. When using the full width page, the image looks horrible – even though the image I uploaded was 525×525. Any suggestions would be highly appreciated! Thank you!

Reply

Brooke August 25, 2013 at 5:16 am

Found the solution @mat & @Michael for the pixelated 300×300 image on product page. Go into WooCommerce plugin settings, choose the "Catalog" tab, scroll to bottom and find section "Image Options", Change the one labeled "Single Product Image". I changed mine to 500×500 and my images now display at their natural resolution! Yay!

WooCommerce > Settings > Catalog > Image Options > Single Product Image

Reply

Teddy Triton Teddy Triton August 26, 2013 at 9:11 am

Thanks for sharing the solution with us Brooke – it's very much appreciated!

Reply

Alex lara May 19, 2013 at 12:24 am

Hello,
I was wondering if i can remove the display banner image on the mystile theme and install a slider plugin instead. If so where do i go about doing this. I can only really edit my homepage on the mystile options because i do not have a page under pages. I followed your tutorial on youtube and was just curious on if there is a way to access this page so i can customize beyond just the mystile options.
Thanks!

Reply

Gerhard May 20, 2013 at 6:49 am

Hi Teddy
I’ve been having so many issues trying to do something which seems simple, I want to replace the SALE! logo with my own text, instead of it Saying SALE! i want it to say something else, so managed to find this piece of code in the page’s html code
Sale!

and changing the Sale! text in firefox inspector mode works, I found span.onsale in the style.css file but that only conrols the position, colour and shape of the Sale badge not the text in it. So where do I find the file that contrlols the actual word “SALE!” ? Also If I wanted to replace the sale badge completely with a cutom image instead of a piece of code that writes up the word Sale on top of a circle, how would I do that?
Kind Regards
Gerhard de Jager

Reply

Alex Lara May 22, 2013 at 8:20 pm

Hello,
I was looking to change the color of the page-wrap on the mystile theme. Is this possible?
I would like to change it front white to some other color.
Thanks!

Reply

beamkiller May 26, 2013 at 4:30 pm

Hello,

Thank you for this post and video, it helped me a lot. I am new to Wordpress, I rather use Joomla for pages or PHP/MySQL.

Do you know how can i edit the Top menu in right upper corner?

And how can I translate the text in it? I already translated text with help of CodeStyling Localization, but no effect at all.
http://docs.woothemes.com/document/woocommerce-localization/

Thank you.

Reply

beamkiller May 26, 2013 at 4:51 pm

Okay, I found it in: /web/wp-content/themes/mystile/header.php

Reply

Jason June 20, 2013 at 2:01 am

Hey,

Thanks for the tutorial this helped a lot. My only problem is that although I got my own custom homepage and menu, when I click on the name of my site on the left, it still goes to the original homepage instead of the one I made. How can I change it so that it goes to the one that I made instead?

Thanks,

Jason

Reply

Teddy Triton Teddy Triton June 21, 2013 at 8:19 am

Hi Jason,

I'm glad to hear the tutorial was helpful. To Fix the issue, change the "Reading" settings in the WordPress admin.

In the WordPress admin go to Settings > Reading > set "Front page displays" to "A static page" > select your custom homepage > save changes and it should solve the issue.

Let me know if this helps. Thanks,

Adam

Reply

Ramil June 26, 2013 at 3:06 pm

Hello,
thanks for very useful tutorials.

Could you please help me to find the source of "Checkout" text filed. I mean that which placed in top, between items amount and Search Products fileds.

I'd like to translate it to another language, but can't find the the source file of this text.

Thank you.

Reply

Ramil June 26, 2013 at 3:21 pm

sorry,

just have found it in file themes/mystile/header.php

line 50

Reply

Amanda June 30, 2013 at 11:25 pm

Hello! I'm currently using the Mystile theme & have really no idea which part of CSS to go to in order to edit the site width. Please help me, thanks a billion! :)

Reply

Teddy Triton Teddy Triton July 2, 2013 at 12:36 pm

Hi Amanda – Are you looking to reduce the width of the Mystile theme? Please provide more detail and I'll try to find the right CSS to edit. Thanks,

Adam

Reply

Amanda July 3, 2013 at 11:17 am

Hi Adam,

I am actually trying to increase my width!
My website is http://doublestatement.com/

Thanks a lot in advance!!! :D

Amanda

Reply

Teddy Triton Teddy Triton July 8, 2013 at 3:44 pm

Hi Amanda,

I really like your site – nice work! I'm honestly not sure how to increase the width of the Mystile theme. Chances are good someone out there does know how to do it so I'll publish this comment and ask for help on this one.

Thanks,

Adam

Reply

Steven July 4, 2013 at 5:09 pm

Hi,

Loving the tutorials, they have answered a lot of questions for me.

Do you know if there is a way to make the logo a bit bigger? it just looks a bit to small to me.

Cheers

Reply

Teddy Triton Teddy Triton July 8, 2013 at 10:49 am

Hi Steven,

Complements on your site – you've done a great job customizing the Mystile theme. You can make the logo larger by simply creating a larger image (currently your logo size is 238x61px) and then choosing the "Full Size" option when uploading it in the Mystile theme settings. After uploading the full size logo go to…

Mystile > Theme Options > General Settings > Display Options > in the Custom CSS box paste the following…

img {
vertical-align: bottom;
max-width: 80%;
height: auto;
}

Just change 80% to 100% (or any number you want) and you'll have a full size logo on your custom Mystile theme. Thanks for the complements on our tutorials and let me know if this helps.

Adam

Reply

Barbra Ignatiev July 11, 2013 at 8:44 am

This helped me so much! Thanks, Adam :)

Reply

Teddy Triton Teddy Triton July 11, 2013 at 2:58 pm

Hi Barbra – I really like your site – nice work! Thanks for letting me know it was helpful.

Adam

Reply

Nick September 1, 2013 at 3:22 pm

Adam the css you recommend does some distortions in the images for the products as well. When you click a product to zoom, then the height becomes distorted. Do you know any other way to make smaller the logo?

Also one big question I have still is, how do you remove the double line above the image (between logo and image). I see nobody found the answer yet.

Thanks
img {
vertical-align: bottom;
max-width: 80%;
height: auto;
}

Reply

S Singh July 19, 2013 at 9:40 pm

Hi,
Enjoyed your web tutorials and it gave me the confidence to venture on my own to build an eCommerce site. I am on test site and exploring the Mystile theme before purchasing a domain of my own.

On the Mystile theme at the homepage, I am having problems with the homepage banner. The banner is always wider on the width of page (navigation bars, featured products width, etc) when I reduce the size of the screen. The banner does not resize with the screen, it always stays larger in size and the rest of the information on screen.

Any homepage banner CSS which I can edit?

Thanks

Reply

Paul July 20, 2013 at 7:24 am

First off this is a great resource, and following your comprehensive instructions have made set up a doddle!

One question that I cant find the ans too, on the Mystile demo "sample page" in the sidebar there is a list of posts with images and the title. Also tabs with latest, popular,comments. Where is this on the theme? I just want an image and 2 lines of text/post but what they have in the demo would be a start!

Thanks again for a fantastic site!

Reply

Teddy Triton Teddy Triton July 22, 2013 at 1:26 pm

Hi Paul,

I believe what you're referring to is controlled via the use of a WooThemes custom Widget called, "WooDojo Tabs". To get it, simply install and activate the free WooDojo plugin. Once installed, go to Appearance > Widgets and you'll see the WooDojo Tabs widget.

Let me know if this helps.

Adam

Reply

Paul July 22, 2013 at 6:04 pm

Thanks Adam
Gave that a go but there is no control over what is displayed e.g which categories of posts (I have a category of stuff just to go in the sidebar).

Don't really want the tabs – just a few snippets of posts and a thumbnail for each.
I found a clunky work around by using a "display posts" shortcode plug-in then using [display-posts] in the text widget. – I am sure there is a more elegant solution!

Reply

Richmond Amem August 9, 2013 at 6:43 am

I first have to thank you for all the great tutorials on your youtube channel.One of my problem with the Mystile theme is how to replace the word "reviews" with "testimonials"
Secondly is how to remove the product description tab beside the 'Review' tab.Am hoping you can show me the perfect line of code to edit to change the "reviews" on the single product page to "testimonials" and also that of product description tab.Thanks.

Reply

mark zielke August 10, 2013 at 12:59 am

Thanks for the tutorials! Is there any way to get rid of the search bar in the mystile theme? Thanks in advance for any/all help!

Reply

Teddy Triton Teddy Triton August 10, 2013 at 4:11 pm

Hi Mark,

I created a video that shows you how to remove the Mystile theme search box. Please watch the video and then use the CSS below. In your WordPress admin you'll go to Mystile > Theme Options > General Settings > Display Options > paste it in the Custom CSS text box > Save All Changes

Here's our tutorial video on removing the search box on the Mystile theme…

http://youtu.be/Ox0CvKRPeYU

Here's the CSS…

#top .wc-nav li.search input {display:none;}
width: 100%;
padding-left: 0;
}

Reply

Jonathan August 12, 2013 at 2:28 pm

Hi

Love all the videos. Thanks. I have a small issue on my Mystile theme. I cannot seem to find out how to remove the leave a message box at the bottom of my homepage. Any ideas ? Also I have a */> in the top right of all my pages and can`t seem to find how to remove them ? Any ideas ?

Is it possible to change the colour on the page ?

Thanks in advance.
Jonathan

Reply

Jonathan August 12, 2013 at 2:30 pm

Sorry top left . Thanks

Reply

Teddy Triton Teddy Triton August 16, 2013 at 9:56 pm

Looking to reduce the white space above and below the Mystile theme homepage featured banner image? If so, here's our tutorial video that shows you how to do it…

http://youtu.be/g9sNq1xtne0

Here's the custom CSS used in the video to reduce the white space on the homepage of the Mystile theme…

#header,
.homepage-banner {margin-bottom:0px!important;}

Reply

Nick October 13, 2013 at 10:11 am

Hello everyone and I salute your great effort and enthousiasm for people who want to build a site (or store) on the web. Congrats once more.

I have recently started my woocommerce using artificer theme (as child of course).

I was about to ask the question below but I have found the solution (!) so below is the question and the answer as well.
Q.: How do I control the space between the primary menu bar and the slide that follows? It is quite big and if I use breadcrumbs it gets bigger.

A.: Go to the style.css of the child (or the main theme – not recommended) and search for: #navigation.

Now edit the file by changing only the value of the attribute margin-bottom from whatever it is to 0px !important. Below is my portion of style.css. Hope this helps someone.

#navigation {
clear: both;
margin-bottom: 0px !important;



Reply

Teddy Triton Teddy Triton October 13, 2013 at 4:21 pm

Thanks for sharing that Nick! I'm sure it will help many people that have the same question.

Reply

John August 20, 2013 at 6:45 am

using WooCommerce 2.0.13, with your help via youtube tutorials. Using Mystile 2.0.13, WP3.6
Simple question, I have tried so hard to resolve.
While editing pages on your tutorials there are many tools, eg heading sizes, on my set up there is none, how do I get more editing tools. I have spent hours on this.
cheers

Reply

John August 20, 2013 at 6:51 am

just read a reply to a comment below, "Make sure the "Visual" tab is selected and you're displaying the full kitchen sink", fantastic problem solved, knew it would be so easy when told how to do it. Many thanks.

Reply

William August 21, 2013 at 2:23 pm

Can anyone tell me how to change the size of the featured image of the Mystile theme? I like the featured image, but it's way too big and takes up all of the prime space. I would just like to make it shorter and keep the width. If I upload a smaller image, it just enlarges it and it looks pixelated.

Reply

Patricia Marrone August 22, 2013 at 8:13 pm

Hi, I'm building my first WordPress ecommerce website and after much search found your most informative site. After watching many youtube videos, reading many posts and learning A LOT from them I have some questions I'm hoping you can help me with.

I am using the Wootique theme and would like to know the following:
1. How to get rid of the search box at the top of the all pages.
2. How to make the container wider (as I see on the "doublestatement.com" site (from one of your post replies)
3. How to reduce white space above, below and in between some of the titles on the homepage. I see the custom CSS on how to do this on the Mystile theme, but have no clue where to insert it.

Please keep in mind I'm willing to give anything a try but have no idea where I would need to insert code, etc. without VERY specific instructions….did I mention I am a newbie?

Thank you in advance for your help.

Pat

Reply

Teddy Triton Teddy Triton August 29, 2013 at 7:42 am

Hi Pat – congrats on taking the first steps in learning WordPress and building your first eCommerce site with WP and the WooCommerce plugin. I'm glad to hear that our tutorials have helped guide you through the process.

Let's start with your first question… Log int your WordPress admin and go to…

Wootique > Theme Options > General Settings > and in the Custom CSS box paste the following….

.searchform {display:none;}

Save All Changes and that will prevent the Search box from displaying on the Wootique theme.

Off the top of my head, I'm not sure on questions 2 and 3… I'll spend some time later today playing around with the CSS.

Reply

justblackcaps August 23, 2013 at 11:53 pm

Hi,
Thank you again for sharing great tutorials on wordpress especially mystile and woocommerce theme. Your site helped me a lot in creating my online site http://www.justblackcaps.com.

I originally had the slider on homepage. However, it took too long to load. So i decided to switch to mystile homepage banner. I have trouble adding mystile homepage banner on my site. I uploaded the file but it is not showing on the homepage. Can you please help?

Thank you.
Laura

Reply

Teddy Triton Teddy Triton August 24, 2013 at 7:55 am

Hi Laura,

I'm happy to hear that our WooCommerce tutorials have helped you in building your Mystile theme site. It's looking really good and I really like the simplicity of the hats you're selling. I'd be happy to help with getting the homepage featured banner image back up on the site. If you can create a WP admin user account for me to access the Mystile > Theme Options section in the admin I should be able to get the featured image banner back up quickly. Thanks

Reply

Jay August 24, 2013 at 4:57 pm

Hi Teddy,

First I'd like to say AWESOME JOB!!! on your very helpful instructional videos. This particular post helped me a lot. Thank you.

I am having an issue with the product category titles for Woocommerce and I'd like to know if there is a way to change the font size at least and/or the font color if possible. Also if its possible to prevent it from showing up on the pages just like you did for the "home" page title. I tried deleting it the same way but woocommerce adds it back so guessing categories must have a title which makes sense.

I'm a novice at code so If there is a solution that does not involve code it would be a life saver. I'm ok with finding out where to add code to change things though.

I am using woocommerce and mystile theme.

Thanks so much for your great help.
Jay.

Reply

Teddy Triton Teddy Triton August 28, 2013 at 7:44 am

Hi Jay – Thanks for your support and I'm glad to hear that our WooCommerce tutorials have helped in building your site. In regards to changing the size and color of product category titles… Are you referring to the default "Featured Products" and "Product Category" labels that show on the homepage of the Mystile theme? Please provide a screen capture of exactly what you're referring to and I'll try and get you the custom css to make those updates.

Reply

Matt Howard August 31, 2013 at 8:52 pm

Good job on the the instructions so far but I still have one small issue. I am trying to figure out how the change the product categories on the home page to just the top level and not all the sub categories?

Reply

Teddy Triton Teddy Triton September 2, 2013 at 9:39 am

Hi Matt,

You can control the display of product categories via the use of custom menus. In the WordPress admin go to… Appearance > Menus > create your custom menu to control the display of your product categories.

Reply

Kole September 4, 2013 at 9:17 am

Hello! Great info on this site. Still one question I haven't seen asked on here that I really need instructions for. How do I change the content background to a different color besides white. I'm sure it's some type of CSS code.

Reply

Teddy Triton Teddy Triton September 7, 2013 at 6:45 pm

Great question Kole – I will work on finding an answer to that asap. In the meantime, I'll go ahead and publish this question and ask the Upload WP community to chime in with solutions.

Reply

Denis September 5, 2013 at 12:26 pm

My client wants to remove the banner entirely from the home page. I noticed that in Google Chrome the space became larger. In Firefox the term "stars of nour banner" appears.

How do I solve these two issues.
Note that I made other modifications to the top of the theme since my client wanted no background image showing at the top of the page

Reply

Mike September 6, 2013 at 5:44 pm

Hey Teddy,
Thanks for all the great info above. Have watched several videos. You have fixed several problems before I encountered them. However, the two issues I'm having are:

Banner not showing: I've clicked, unchecked, reloaded, resized, double checked, reread, re-reloaded, re-reread…

Trying to center my Logo have tried different sizes but not happening.
I've seen code on another site that does it, but wrecked my last site by 'inserting code' where it didn't belong.

About to look at setting up a child theme.
Can you point me in the right direction.
Many thanks!

Reply

Teddy Triton Teddy Triton September 7, 2013 at 6:35 pm

Hi Mike – Thanks for letting us know that our Mystile theme tutorials have helped. Also, I have to complement you on your business model. I think the idea is very unique and given the new laws makes a ton of sense to capitalize on. I've already emailed your URL to several friends so I'm hoping for some kind of kickback – lol! Anyway, it looks like you solved the logo centering issue but I see that your featured banner image is still not showing. If you can create a wp admin user account I'll take a closer look. You can email it to me via the contact form here… http://uploadwp.com/contact/

You should definitely use a Mystile child theme to ensure that your customizations are not lost. You can get our free mystile child them by opting into our newsletter.

Reply

sterling September 12, 2013 at 12:58 pm

Great video! I have some questions about the mystile theme. I'm a beginner and this is my first site I'm creating by myself but I seem to be a little stuck on finishing it and launching it. So my question is I want to change the frame's color, is there anyway I can do that?

Reply

Teddy Triton Teddy Triton September 13, 2013 at 7:16 am

Hi Sterling,

Thanks for the complements on our Mystile theme tutorial video. You have the ability to "Enable boxed layout" which wraps your site content inside a frame. You can do that from in the Mystile > Theme Options > Layout Options settings. If you choose a boxed layout, then you also have the ability to change the background color and/or add an image to the background. Let me know if that helps answer your question.

Reply

dyer September 19, 2013 at 4:56 am

Hi Teddy the top nav menu isnt containing the sub menus under the main menu in the Safari browser, any advice on how to stop this happening? Mystile theme

Reply

Teddy Triton Teddy Triton September 19, 2013 at 7:37 am

Hi Dyer,

Have you tested it in other browsers such as Chrome and Firefox so that you know it is just an issue when using Safari? If so, please send me a screen capture of the issue so I have a better idea of what's going on and and trouble shoot it using my mac. Thanks

Reply

sterling September 19, 2013 at 8:53 pm

Hello Adam or anyone else that can help me out,
I was looking to change the color of the page-wrap on the mystile theme. Is this possible?
I would like to change it front white to some other color. I try to do it on firebug but I couldn't find which one it was. so if anyone knows it please help me out
Thanks!

Reply

Ronaldo Santos September 20, 2013 at 9:24 am

Good morning!

Your site is very good and full of tips. Enjoyed!

I followed your tutorial and all your tips, but I could not make the banner appear highlighted on my page.

Is there another way?

My site http://ideia.ronaldosantos.com

I thank you.

Big hug.

Reply

Teddy Triton Teddy Triton September 21, 2013 at 7:49 am

Hi Ronaldo,

If you create a WP admin user acct for me I will take a closer look and hopefully get the homepage feature banner to display. Use the Contact form on UploadWP.com to send me the login info – that form goes to my email. Thanks – Adam

Reply

Ronaldo Santos September 21, 2013 at 12:00 pm

Dude, I followed your tutorial to put a slide. used the soliloquy, and it worked. The only problem now is the space between the menu and highlight banner. You know how to solve this problem?

Reply

Marco September 29, 2013 at 4:28 pm

Hello Teddy, thank you very much for your article.
I am a beginner on the development of WordPress and I would like to ask you a few questions, please.
What is the function of the custom.css file of the theme Mystile?
For an irreversible change after the upgrade, you can use custom.css or create a child-theme of Mystile?
The theme changes made ​​by the Theme menu Options remain after the upgrade?
Thank you very much.
Marco.

Reply

Teddy Triton Teddy Triton October 1, 2013 at 1:35 pm

Hi Marco,

That's a great question in regards to what the purpose of a child theme is if you use the Custom.CSS box in the Mystile theme options. The custom.css box is a great way to make simple changes to your site's look and feel. However, if you were to make deep customizations you'd have to go beyond the Custom.css box and edit individual files. That's where it's critical that you use a child theme because updates made to individual files will be overridden if you're not using a child theme. So it's always best practice to use a child them every time so that your site can scale as you're business booms and you need to make crazy changes to your theme. Please let me know if that makes sense.

Reply

marco October 2, 2013 at 1:08 pm

Thank for your response. The child-theme is the right solution. In case of failure to theme, reinstalling everything at once.
I have not found in options theme Mystile, saving customizations. Thank you very much, I will continue to read your articles.
Marco.

Reply

CK October 4, 2013 at 11:36 pm

Hi Teddy, how should I go about producing that light-coloured bar after the banner (the same one as the one above the banner). i.e. http://i.imgur.com/BEUs2pF.jpg (Screenshot taken from woothemes)

Reply

Teddy Triton Teddy Triton October 7, 2013 at 12:32 pm

Hi CK – Are you looking to remove the light colored bar below the featured banner image on the homepage of the Mystile theme? Or, are you trying to find the CSS to recreate it for another part of the page?

Reply

CK October 8, 2013 at 10:54 am

Recreate it

Reply

Teddy Triton Teddy Triton October 25, 2013 at 7:34 am

If anyone in the Upload WP community can help CK it would be greatly appreciated.

Reply

CK November 22, 2013 at 9:43 am

Still to no avail?

Vikram Bahk October 6, 2013 at 9:26 pm

Great tutorial! I am using the Mystile theme for woocommerce and have added a lot of rules to my custom.css file. As a result, the website looks really crap on mobile. Any idea how I can DISABLE the responsive layout settings? Thank you.

Reply

Teddy Triton Teddy Triton October 7, 2013 at 9:14 am

Hi Vikram,

That's a great question in terms of how to disable responsive themes. In other words, how to remove responsive functionality from a Responsive theme. I've not had a chance to research that but most likely one of our readers has. I just did a quick Google search for "disable responsive wordpress theme" and I found this thread from the WordPress Support Forum that might help…

http://wordpress.org/support/topic/how-to-completely-remove-responsive-functionality-from-responsive-theme

If anyone in the Upload WP community knows the answer to this one please share it with us.

Reply

Vikram Bahl October 13, 2013 at 10:18 pm

Ok, figured this out.

If you are using Mytile, go to wp-content/themes/mystile/styles folder and open the .css file which your theme is using.

If you search for '@media', you will get css lines like "@media only screen and (min-width: 768px)". This means that for tablet or mobile resolutions, which are below 768px width, the styles wont work. You can search for all occurences of this lower bound and change it to say..1px or you can comment this out.

Then go to custom.css and add this style:

html.boxed body {min-width:1250px;}

This will ensure that your home page layout does not change in mobile/tablet resolutions.

Finally, if your menu is getting converted to a 'select' dropdown menu on your mobile, go to wp-content/themes/mystile/includes/js/general.js and comment out the code below "Responsive Navigation (switch top drop down for select)".

Reply

Teddy Triton Teddy Triton October 14, 2013 at 7:27 am

Thanks for sharing the solution with the Upload WP community Vikram! I'm sure it will help many people.

Reply

Sarthak October 9, 2013 at 5:07 am

Hi,
I am using the default MyStile theme and would like to know if there is a way to show more than the default 19 products on homepage.

Thanks

Reply

Teddy Triton Teddy Triton October 9, 2013 at 7:14 pm

That's a great question Sarthak. It's a question that at the moment, I don't have an answer for. However, I will look further into this one and do my best to get you an answer.

If anyone in the UploadWP.com community knows the answer to…

Is there a way to show more than 19 featured and Recent products on the Homepage of the Mystile theme?

Please chime in – you'll be helping many people that have the same question.

Reply

Monica October 10, 2013 at 6:27 am

Hello I susbscribed, first of all, than you so much for taking your time to do these tutorials, they have helped me alot!
I would like to know how I can add the banner, I have followed all instructions but after saving the changes, it does not show, can u please help me!?

Reply

Teddy Triton Teddy Triton October 10, 2013 at 8:13 am

Hi Monica – Thanks for subscribing! I'd be happy to help get the featured banner image to show on the homepage of your Mystile theme site. Please create a WordPress admin account. You can send it to me via the Contact form here… http://uploadwp.com/contact/

Reply

Robert October 11, 2013 at 5:21 pm

Hey there!

Having trouble uploading the featured image banner on the mystile themed homepage. Please help!

Reply

Teddy Triton Teddy Triton October 13, 2013 at 8:51 am

Hi Robert – I really like the hats and shirts you're selling. In regards to the Mystile theme homepage featured banner image not showing… Have you had a chance to check out our video tutorial on it? If not, here's the link…

http://youtu.be/9cfvzqBHxTA

If so, I'd be happy to try and get it working for you if you want to create a WP admin user account for me. You can send me the login info via our Contact form…

http://uploadwp.com/contact/

Reply

Arshian October 12, 2013 at 1:48 am

can u please help. in mystile theme my product images r looks blurry and they r not properly adjusted you can see in my website

Reply

Teddy Triton Teddy Triton October 13, 2013 at 8:45 am

Hi Arshian – have you solved the issue with your product images? I just took a look at your site and they seem to be clear. Let me know. Thanks

Reply

Francisco Gual October 12, 2013 at 8:33 pm

Hello, started a Woocommerce site using the Mystile theme by following your video tutorials. It's at plrprospector.com. Quite an experience but still stumped on a few things. Could not get the primary widget to appear on the home page. It does appear on the shop page, which I've now set as the landing page. Still, on the shop page the primary widget only covers the bottom half of the page. Also, can't get the Mailchimp form to appear on the primary widget so it's on the footer. I'm selling PLR downloads only, not a single sale yet though. Is there a free slider that would work on Mystile? Can you recommend anyone who can analyze this site?
Thanks.

Reply

Teddy Triton Teddy Triton October 13, 2013 at 8:42 am

Hi Francisco,

I've spent a few minutes looking at your site, PlrProspector.com and here are some of my observations…

1. You might want to consider changing the dimensions of your Logo so that it has more length rather than height. It's currently too tall and is pushing the entire site down / below the fold. So reshape your logo so that it brings your products up.

2. To get the sidebar to show on the homepage of the Mystle theme do the following… In the WordPress admin go to Mystile > Theme Options > Homepage > Sidebar > check the box that says "Display a Sidebar" > the sidebar will then show up on the home page.

3. WOW Slider is a a free image slide that you might want to try

Let me know if this helps and feel free to ask when more questions come up.

Reply

Alex October 13, 2013 at 1:05 pm

Hi there
I am struggling badly and there isnt anything out there to help me. This is my site. i am trying to reduce the width and also center everything from logos, tabs, slider and text to all be in line with each other. I would like it to be of similar width too
Please help!!

Reply

Teddy Triton Teddy Triton October 14, 2013 at 7:21 pm

Hi Alex – have you had a chance to view our tutorial on how to Reduce White Space Above and Below Mystile theme Homepage Banner Image? http://youtu.be/g9sNq1xtne0

If so, let me know and I'll help further.

Reply

Alex October 14, 2013 at 7:55 pm

Hi there,
Thank you for your response. I actually wanted to decrease the overall width off the page its currently very wide. If its easier all i need right now is that the text line up with the slider bar. As you can see the text runs for the full width of the page. Ive used the indent tool but it only indents on the left and doesn't indent on the right.

Thank you for your help

Reply

Teddy Triton Teddy Triton October 16, 2013 at 6:40 am

Hey Alex,

Were you able to find a solution for this or is it still an issue?

Reply

Alex October 17, 2013 at 7:56 pm

Hi Teddy,

Indeed i did. Thank you for you help!

Suzanne October 13, 2013 at 7:41 pm

Hi,
All your tutorials have helped so much especially for someone like me who has never done this before and knows nothing.

I somehow lost the cart page and have tried going to the woocommerce – settings – pages and select and update, it still doesn't work. I can shop and put things in the cart, but won't checkout. I would really appreciate you telling me how to get this back and working without messing up all the work I've done.

Can't thank you enough.

Reply

Teddy Triton Teddy Triton October 14, 2013 at 7:42 am

Hi Suzanne,

I'm happy to hear that our tutorials have been helpful. I took a look at your site and it looks like a second Cart page was created and it has the following permalink…

artrageousnecessities.com/cart-2

what you need to have is…

artrageousnecessities.com/cart

So in the WordPress admin go to Pages > edit the Cart page > on the Edit Page below the title you'll see Permalink click Edit > change it from cart-2 to just cart > click OK > Update the page

Also make sure that the following shortcode is in the body of the page…

[woocommerce_cart]

Let me know if that works.

Reply

Sparks October 17, 2013 at 12:05 pm

Hey
Thanks again for another excellent tutorial, they've really helped me with my new shop for my website.
Just wondered if anyone could help me customise the header of my mystile theme site? I'd like to add text in the header – a small description of my business, social media icons and phone number. How can I add these details to my header?
Hope someone can help me with this :)
Thanks

Reply

Teddy Triton Teddy Triton October 18, 2013 at 7:51 am

Hi Sparks,

There are a couple of options… You could use a text title. Do that by going to Mystile > Theme Options > General Settings > check "Text Title" box and "Site Description" box. That will allow you to add a slogan under the site title. Option 2 would be to create a logo and build your text / slogan into the logo. The logo gig that I've been using on Fiverr is… http://fiverr.com/pletex/create-amazing-logo-for-your-company

Let me know if this helps.

Reply

von October 19, 2013 at 3:57 pm

Hi, a few others have asked this as well.. how do i change the size of the banner? it is so huge! haha.

Reply

Teddy Triton Teddy Triton October 22, 2013 at 7:14 am

Hi Von,

To reduce the size of the Mystile theme homepage featured banner image do the following…

In the WordPress admin go to: Mystile > Theme Options > General Settings > Display Options and in the Custom CSS box paste the follow…

.homepage-banner { width:90.5%!important}

You can change "90.5%" to any percentage to reduce the size of the featured banner image. I made a tutorial video on how to do this which you can view here…

http://youtu.be/yaGjFGjSIfk

You might also be looking to reduce the white space above and below the featured banner image. To do that, copy and paste the following custom CSS into the same box…

#header,
.homepage-banner {margin-bottom:0px!important;}

Reply

Travis Campbell October 22, 2013 at 7:40 am

HI, Great tutorial. How do I add the author's name on each blog post? It is not showing up.

Reply

Teddy Triton Teddy Triton October 23, 2013 at 2:14 pm

Hey Travis,

That's a great question. I've spent some time testing it out on my Mystile theme demo site, http://www.digitaldownloadsdemo.com/, and I have not been able to get the author's name to appear for blog posts either. If you look at WooThemes Mystile demo, the author name doesn't appear on blog post either.

One thing that you can do is install the "WP User Avatar" plugin which will allow you to upload an image of the author and it will display for each blog post along side the title. For each post, you can say something like, written by, author name. Also, do a quick search and see if there is another plugin that will display authors name for each blog post. Most likely there is. Let me know if this helps.

Reply

Andy October 29, 2013 at 8:44 am

I am using mystile theme and in the single product page, the product photo looks enlarged. I tried few solutions from wp forum but they did not work. Any tips?

Reply

Teddy Triton Teddy Triton October 29, 2013 at 10:22 am

Hi Andy,

To change the size of the featured product image on the single product page page for the Mystile theme complete the following steps…

In in your WP admin go to Mystile > Theme Options > General Settings > Display Options > paste the CSS below into the "Custom CSS" text box…

img {
vertical-align: bottom;
max-width: 100%;
height: auto;

To reduce the size of the product detail page image change "100%" to a smaller number. Let me know if this helps solve the issue.

Reply

Andy October 29, 2013 at 10:25 am

Thanks a lot, will check it today!

Reply

Andy November 1, 2013 at 3:28 pm

Thanks it helped!

Reply

BruceDeutsch October 29, 2013 at 10:24 am

Hi!
Thanks for the video. You do a great job of explaining.

I would like to remove the standard header navigation from the Mystile theme. I want to use a menu widget in my sideabar instead of the navigation that comes with the theme. Everything I have found so far on the web deals with the Canvas theme, but none of the approaches for removing the header navigation with Canvas work with Mystile.

Thanks!

Reply

Teddy Triton Teddy Triton October 31, 2013 at 4:57 pm

Hi – Thanks for your complements and your question. I liked it so much that I decided to do a full tutorial on it, video and all… If you scroll up you'll see the newly added, "Customizing Mystile theme Part 2". Thanks again.

Reply

Claudio October 30, 2013 at 1:26 pm

Hi all, few question on this good template.
I'm working on it and i've found two errors in translations in my language (italian):

First one the checkout button on top right of nav bar
http://s11.postimg.org/6j8adw70z/Checkout.jpg

Second one when i'm going to checkout, i need to fill all informations and agree to term and conditions to proceed, i need to modify that string underlined
http://s11.postimg.org/4sp9cephv/termini_e_condizioni.jpg

Where i can found them and translate propely?

Thanks in advance!

Reply

Claudio November 19, 2013 at 4:58 am

Someone can help me?

Reply

Teddy Triton Teddy Triton November 19, 2013 at 8:01 am

Hi Claudio,

What do you need help with? Let me know and we'll do our best.

Reply

Claudio December 4, 2013 at 11:52 am

Hi all, few question on this good template.
I'm working on it and i've found two errors in translations in my language (italian):

First one the checkout button on top right of nav bar
http://s11.postimg.org/6j8adw70z/Checkout.jpg

Second one when i'm going to checkout, i need to fill all informations and agree to term and conditions to proceed, i need to modify that string underlined
http://s11.postimg.org/4sp9cephv/termini_e_condizioni.jpg

Where i can found them and translate propely?

Thanks in advance!

I need help with this

Reply

Teddy Triton Teddy Triton December 5, 2013 at 9:41 am

Hi Claudio,

Thanks for your questions. I'm going to have to do some research to find possible solutions for both of them. In the meantime, I'll go ahead and publish your comment and ask for help on this one from the Upload WP community.

If anyone out there knows how to solve either of the questions Claudio posted please share with us here. Thanks

Claudio January 1, 2014 at 2:32 am

Thanks a lot

Andy November 1, 2013 at 3:32 pm

Hello! Thank you for the great tutorial!

I have a question related to uploading the photos. It is not an issue of the theme, but more a problem of the plugin I am using (wp all import), but when i try to upload the product images I get a message WARNING: File cannot be saved locally …
and the image wont be uploaded

Any ideas how to solve it? thank you in advance.

Reply

Teddy Triton Teddy Triton November 3, 2013 at 8:14 pm

Hi Andy,

I've not had a chance to test the wp all import plugin so I'm going to have to ask for help on this one. If anyone in the Upload WP community can help Andy it would be greatly appreciated.

Reply

Mifundum November 4, 2013 at 10:54 am

Hi guys!

Does anyone know how to change the top and footer color?

Cheers! Mif

Reply

Teddy Triton Teddy Triton November 6, 2013 at 8:45 am

Hi Mif,

The CSS to change the color at the top of the Mystile theme is…

#top {
background: #f7f7f7;
margin: 0 -1.618em;
padding: 1.618em;
}

Copy the CSS above and do the following… In your WordPress admin go to Mystile > Theme Options > General Settings > Display Options > paste it in the Custom CSS box

Just change #f7f7f7 to any color that you'd like. There are a bunch of free color picker tools if you google it.

I'm still working on the CSS for the footer background color.

Reply

Andy November 5, 2013 at 2:59 am

Hello,

thank you for tutorial! The contact form won't send messages to my mail box. Do you have any suggestions how to fix it?

Thank you in advance!

Reply

Teddy Triton Teddy Triton November 5, 2013 at 7:20 am

Hi Andy,

My suggestion is to use the Easy Contact plugin. I use easy contact for all of my sites and it's worked great. To setup the easy contact plugin do the following…

In the WordPress admin go to Plugins > Add New > search for "Easy Contact" > install / activate it > then create a page called "Contact" and in the page paste the following shortcode…

[easy-contact]

The last step is to go to Settings > Contact > enter your email address in the "Recipient Email" text box > save changes and you're all set.

Reply

Niné November 7, 2013 at 4:06 am

Hello,

Thanks very much for your tutorials, they are very helpful and easy to follow. Realy great!
I'm struggling to change the color of the menu toggle in my mystile theme for mobile.

Any suggestions how to do that?

Thanks,
Niné

Reply

Niné November 8, 2013 at 5:07 am

Found the solution to do that using some css:
/*TOGGLE BUTTON*/
#navigation{
border:1px solid black;
border-radius: 0;
}
#header .nav-toggle{
border: 0.15em solid black;
background-color:white;
background-image:linear-gradient(#fafafa, #fafafa);
}

Reply

Teddy Triton Teddy Triton November 8, 2013 at 6:49 am

Thanks for sharing this with everyone Nine!

Reply

ali November 7, 2013 at 8:35 pm

Hi Teddy
first of all I very much appreciate these tutorial and huge amount of work that you have put in for all of us. Its tremendous help to novices like myself. I have a question regarding changing the body color of Mystile theme, see i am trying to setup a online candy shop and want to make overall website bit more colorful can you please advise what CSS to edit or any custom CSS that i can use to change over all white color?
would really appreciate any help you could provide

Reply

Teddy Triton Teddy Triton November 8, 2013 at 6:57 am

Hi Ali – Thank you so much for the support in regards to our WordPress and WooCommerce tutorials! It's very much appreciated. The quickest and easiest way to change the background color of the Mystile theme is to do the following…

In the WordPress admin go to Mystile > Theme Options > Styling Options > Background > there you can use the "Body Background Color" picker to set a different color.

Let me know if you're also looking to change the background color of everything inside the boxed layout and I'll work on getting you an answer for that as well.

Reply

Niné November 8, 2013 at 5:05 am

Hi Andy,

Thanks a lot for the great tutorials on using the mystile theme. They are very helpful.

I'm making my first wp-webshop using the mystile theme. I was wondering if it's possible to have a second navigation only in my shop page. I've been searching the web for answers but can't seem to find any.

Thanks very much for your help,
Niné

ps: ZigZagWear Site is not online yet but am in the process of doing that.

Reply

Kenzo November 12, 2013 at 8:03 am

Hej!

Im wondering here how can I remove :hover effects from #top (grey background) and from our main navigation (there's this border around when hovering menu elements).

Please let me know,

Ken

Reply

Danny November 12, 2013 at 8:44 pm

Hi Teddy,
Thanks for all your doing, your really helping us out allot…
This is my first venture into making my own site and it's fun and frustrating at the same time. I'd like to know if the white space above and below my logo can be reduced, and also the grey area above that.. (where the cart/checkout is), can that be reduced or removed? Can the cart/checkout be moved just above the navigation bar. Just seems like to much space is being used up.
Thanks
Danny

Reply

MikeG November 17, 2013 at 1:51 am

Hey thanks for the help so far. I'm having a little trouble setting up the new home page. Is there a way to get the original "home" settings back? I deleted the original from my menu and can't seem to get the layout to match what it was. I tried reinstalling the theme folder through my ftp, but didn't have any luck. Now my home page is all out of wack and my menu bar isn't showing up. If anyone can help I would appreciate it. mikegogno(dot)com/goldenruleshop

Thanks,

MikeG

Reply

Teddy Triton Teddy Triton November 18, 2013 at 8:11 am

Hi MikeG – Most likely you need to adjust your Reading settings. In the WordPress admin go to Settings > Reading > you'll see "Front Page Displays" make sure that the "Your latest posts" radio button is selected an NOT the "a static page". Start by checking that and let me know if it helps.

Reply

George November 19, 2013 at 10:13 am

Hi there,

I've tried doing the replace of the mystile navigation section, but I'm coming up with this error:

current() expects parameter 1 to be array, null given in /public_html/wordpressdev/wp-content/themes/mystile-child/header.php on line 51

Any ideas how to fix it?

Thanks!

Reply

Teddy Triton Teddy Triton November 21, 2013 at 3:48 pm

Hi George,

Have you found a fix to this issue yet? If not, please let me know the URL to your site so I can take a closer look. Also, if you could recreate the exact steps you took that will help me trouble shoot the issue. Thanks.

Reply

Cherie January 23, 2014 at 7:01 am

Hi Teddy,
I have the same issue while trying to replace the Mystile theme main navigation with a top-right widget section.

here's the notification I got on my homepage….

Warning: current() expects parameter 1 to be array, null given in /home1/cherie/public_html/wp-content/themes/Mystile Child Theme/header.php on line 51

Please, could you tell me what's wrong?

Thanks your your help,

Best regards

Reply

Teddy Triton Teddy Triton January 24, 2014 at 8:01 am

Hi Cherie,

Were you able to solve the issue? If not, please post in the following thread… http://uploadwp.com/community/index.php?threads/mystile-theme-customizations.23/

We'll help you work through the issue there. Thanks

Reply

Dejan November 26, 2013 at 12:33 pm

Hello,
I have problem with content.php – and I dont know how to edit template to show full width of my blog posts.

http://prntscr.com/26nmk7 Here is SS.

And 2nd problem is border over images on front page http://zlataradaka.com – look quotes, it's border over it – but i cannot remove it – whats problem?

Thank you and best regards.

Reply

Chris Furness November 28, 2013 at 8:45 am

Teddy, thanks for all the help. I'm looking to add a widget (without that line that divides the title and the body) just underneath the menu. So I am not looking to remove the menu, I just want a widget where special offers/messages can be displayed underneath the menu in that white space.

I followed your instructions missing out part 2, but the menu still disappeared.

Is what I am looking for achievable? Any guidance would be appreciated.

Thanks, Chris

Reply

Teddy Triton Teddy Triton December 2, 2013 at 11:42 am

Hi Chris,

Thanks for your question. Just to clarify… You're looking to add a widget section directly under the main navigation? So you would like it to appear under; Home, Shop, Basket, My Account, Checkout, Contact Sally? Please let me know if I'm following you and we'll go from there. Thanks.

Reply

Chris Furness December 4, 2013 at 5:45 am

Spot on Teddy.
I'm looking to have that as a 'Message Board' type thing where we can put the latest. So for example, at the moment the latest posting dates for Christmas, then in January details on some sale prices maybe, and then 'we have just taken stock of ….'

No doubt I'll find a widget that can do that, if not I'll just play with the text widget.

As this is my first woocommerce site, any feedback you wish to make would be most welcome.

Thanks for your time, and all the invaluable help you have provided via your videos.

Regards, Chris

Reply

Teddy Triton Teddy Triton December 5, 2013 at 10:45 pm

I like the "Message Board" ideal allot Chris and think it makes perfect sense. I'll spend some time tomorrow looking into a plugin or CSS modification to make it happen.

If anyone out there can chime in and offer their solution it would be greatly appreciated.

Reply

Chris Furness December 12, 2013 at 5:13 am

Did you have any luck with this Teddy? Cheers, Chris

Rebecca November 29, 2013 at 7:54 am

Hi there, Thanks for the tutorial . I have my mystile up and running and have resolved many issues along the way to get it how it is now http://www.hoshhome.co.uk. What I want to do now is move all of the 'most popular products' section on the homepage up slightly. As you can see, under the logo, there is a large white gap and if I were able to move the images up slightly, people would be able to see more of the images on the average sized laptop. I suppose if I knew how to delete 'home' then the most popular products would automatically go up, would they? If so, how can I do this? Thanks in advance

Reply

Teddy Triton Teddy Triton November 29, 2013 at 9:16 am

Hi Rebecca,

Nice work on your site, HoshHome.com! To move the "Most Popular Products" section up on the homepage of the Mystile theme try the following… In the WordPress admin go to: Mystile > Theme Options > General Settings > Display Options and in the Custom CSS box paste the following…

#header,
.homepage-banner {margin-bottom:0px!important;}

Save all changes and the Most Popular Products section should move up the homepage. Let me know if this works for you.

Reply

Rebecca December 12, 2013 at 12:21 pm

So sorry for the late response but I've only just seen your reply. I did what you recommended and it has moved the products up slightly so it looks loads better. Thanks so much for your help and thanks for the positive feedback about the site- a lot of hard work has gone into it considering earlier this year I had no idea of what wordpress was!

I know it's kind of off topic, but if you'd be able to suggest any reasons why my 'Have a coupon' link button at checkout doesn't work and just takes me back to the top of the page (even though I have set up a coupon), it would be most appreciated.

Thanks again!

Reply

Teddy Triton Teddy Triton December 13, 2013 at 8:29 am

Hi Rebecca,

I see what you mean in regards to the Apply Coupon on the checkout page not working. It tested it in the Cart and it seemed to work there so maybe you want to eliminate it from the checkout page and just have it in the cart. In terms of what's causing the issue… Most likely its another plugin that's not playing nice with it. You could test that by turning off your plugins and see if that fixes it and if it does, turn them back on one by one.

Reply

Rebecca December 18, 2013 at 11:05 am

Thanks for looking. I deactivated my plugins but that makes no difference. For now I think I'll just get rid of coupons from the checkout (like you say it's working on the cart) and perhaps try it again after a wordpress/woocommerce update as I know when I've had little bits like this not work before, an update seems to do the trick. Thanks for your help.

Sam December 3, 2013 at 3:09 pm

Teddy hi,

I left a few comments. They seem to have been deleted from the blog…why?!

Sam

Reply

Teddy Triton Teddy Triton December 3, 2013 at 3:26 pm

Hi Sam,

Hmmm – it's possible they got caught up in the spam filter. Please re-submit your question(s) via a comment and I'll do my best to get you answers / solutions. Thanks

Reply

Sam December 3, 2013 at 8:53 pm

humm… not sure I remember all I think I had posted 3 items. One was in your mystile video you mention that the home page has to be custom url link, not a 'page' why is that?
the other was a possible solution to a question another user posted…

how to get the footer background color changed. I tried this and some other variation with success.
#top { background: #CC3300 ; }
body { background: #CC3300 repeat top left ; }
footer { background: #CC3300 ; }

Third, if I make the main menu a blank menu and only use the top menu, can the space used by the empty menu reclaimed (rest of page moved up?

Lastly, I am using mystile with wooCommerce. I have a top menu showing up on the top left. on the top right I have the wooCOmmerce cart/$0.0 and search. Can I add items to the top right section of the menu. I want to have there some link and/or contact info.
Lastly part II, if I want my email contact info to show but don't want bots to catch that, is there a way of doing this without using an image?

Thanks a bunch.

Reply

Teddy Triton Teddy Triton December 5, 2013 at 9:39 am

Hi Sam,

Thanks for sharing your CSS for changing the footer background color of the Mystile theme. I'm sure it will help a bunch of people that are looking to do that. In terms of your first question I'd have to know what video you're referring to because I honestly don't recall that without seeing it. In terms of your third and 4th questions, the answer is most likely Yes, you can move it up to reduce white space if you only want to use the top menu. For both of those things I would recommend outsourcing that to Fiverr. Instead of wasting a bunch of time trying to figure out how to do it, just use my fried Jason's gig and he'll get if done for you. Here's the link…

http://fiverr.com/jasonbshepard/help-with-wordpress-woocommerce-store

Just tell him Adam from UploadWP.com sent you.

Reply

Sam December 5, 2013 at 3:37 pm

Adam hi, Thanks for the reply. the video is your customizing the Mystile home page. http://www.youtube.com/watch?v=rffLmxCpId0 start view at about minute 10 where you talk about linking a home page to a menu. thanks.

Sam December 5, 2013 at 5:16 pm

I remember my last question… I followed your instruction on setting a banner for Mystile – in particular setting the full size after uploading to avoid a grainy look.
I took the banner image from theme twenty thirteen. However, mine still comes out grainy in Chrome. In IE it is not grainy?! Any ideas?

richard December 7, 2013 at 5:34 pm

the featured image on home page not showing up what have i done wrong?

Reply

Teddy Triton Teddy Triton December 8, 2013 at 7:45 pm

Hi Richard,

Have you tried viewing your site in a different browser? It's possible that it's a cache issue. What's the url to your site? Let me know so I can take a look.

Reply

Malin December 9, 2013 at 1:20 pm

Dear uploadwp,

will start with a big thank you for all your tutorials. They have been such a help for me. Im a bit stuck now though.
I want to change the font and font size of the sidebar, how ?
I have searched both web and css for alternatives and scratched my head. Maybe its just one of those that are so easy you dont see it. But please, help me !

Thank you and again, your tutorials have been a gods send :)

Reply

Teddy Triton Teddy Triton December 9, 2013 at 3:52 pm

Hi Malin,

I'm happy that our WooCommerce tutorials have been helpful in building your site. You can change fonts and font sizes for the Mystile theme by doing the following…

In the WordPress admin go to Mystile > Theme Options > Typography > Enable Custom Typography (check that box) and on that page you can make font adjustments. Let me know if this helps.

Reply

Joe December 11, 2013 at 12:36 pm

Hi! Is possible to change numbers or products per row in homepage? I'd like set three per row (not four)

Best regards.

Reply

Teddy Triton Teddy Triton December 14, 2013 at 5:33 pm

Hi Joe,

It is possible but it's a little more involved. My recommendation would be to go to Fiverr and have someone do it for you. It should only cost $5 and they will do it the right way. The gig I recommend is…

http://fiverr.com/jasonbshepard/help-with-wordpress-woocommerce-store

Just tell Jason that Upload WP sent you and he'll take care of you.

Reply

Malin December 12, 2013 at 4:09 am

Hello again,

You asked me to "In the WordPress admin go to Mystile > Theme Options > Typography > Enable Custom Typography (check that box) and on that page you can make font adjustments. Let me know if this helps."

I have tried this option and it doesnt work for the sidebar meny. Why I dont know, but would like to know if there is another way

Thank you again !

Reply

Teddy Triton Teddy Triton December 12, 2013 at 8:48 pm

Hi Malin,

If you want to create a wp admin user account I'd be happy to take a closer look at it. Just use the Contact form to send me the info and I'll do my best to get it resolved for you.

Reply

Pat December 13, 2013 at 6:37 pm

Hey, been checking our your tutorials all day, extremely helpful! I just have quick question. Is there a way to change the thumbnail sizes of the product images? I have 3 products and am looking to expand the image sizes and have them cover the whole row under the main banner.

Reply

Teddy Triton Teddy Triton December 14, 2013 at 5:09 pm

Hey Pat – Thanks for letting me know our tutorials have helped. Just to make sure I'm understanding your question. You're looking to increase the size of the product thumbnail images on the homepage of the Mystile theme? Please confirm and I'll try to get you the custom CSS to do that. Thanks

Reply

Alison December 17, 2013 at 11:55 am

Hi there,

I love the Variable option on Woocommerce!

But, I was wondering if it is possible to move the location of where a Variable pops up — right now the drop down menu for the sizing of products is underneath the "Product Short Description".

The trouble with this is at the end of the Product Short Description, I have a "Read More" link. This interferes with the size variable; when a customer clicks to change the size, the Read More link pushes them down to the bottom of the page.

Ideally, I'd like to move the size Variable to right under the From: pricing at the top of the page, or move where the "Read More" link is placed.

Is this possible?

Thanks so much in advance for your help; it is greatly appreciated.

Reply

Teddy Triton Teddy Triton December 24, 2013 at 8:37 am

Hi Alison,

Nice work on your site, neuth.com! It is possible to move the location of the variations drop down on the single product page. Please take a few minutes to review our tutorial on Overriding WooCommerce Page Templates here… http://uploadwp.com/overriding-woocommerce-template-files/

Specifically, I think the file you'll need to modify is… single-product.php

Reply

Alan December 18, 2013 at 5:06 am

Dear Mr. Teddy Triton
Thank you for sharing great tutorials on wordpress especially mystile and woocommerce theme. Your site helped me a lot in trying to create my site,
Can you please help me how i could remove the image place holders for product.
at the moment when adding a product it automaticaly creates an image place holder even if you dont upload an image. so in my case i would like to create a restuarant menu, however i dont want to have images created as i don't need that. the following may give you an idea what i want, to appear when i add a product.

Tikka Masala
Cooked with almond powder, fresh cream & special red sauce $10.00 Add "Button"

I would very much appreciate your help.

thank you

Reply

Teddy Triton Teddy Triton December 24, 2013 at 9:17 am

Hi Alan,

So it sounds like you're looking to remove the product image completely from the single product page. If that's that case, here's the CSS to remove the product detail page image…

}
img {display:none;}
vertical-align: bottom;
max-width: 100%;
height: auto;

Just paste it in the "Custom CSS" box and it will remove the placeholder image. If you'd also like to remove the product thumbnail image from the woocommerce Shop page please refer to our brand new Upload WP Community Forums. Specifically, the following tread…

http://uploadwp.com/community/index.php?threads/mystile-theme-customizations.23/

Reply

Alan December 18, 2013 at 7:20 am

Dear mr. Teddy Triton

I have found this plugin "WooCommerce Product Details Customiser" which is great and it does part of the job by removing the image in Product Details page, however i wan to remove the image from the main product page (shop) page.

Than kyou

Alan

Reply

Teddy Triton Teddy Triton December 24, 2013 at 7:54 am

Hi Alan,

Thanks for your question. To remove the thumbnail images from the Mystile theme shop page copy/paste the following in the Custom CSS box…

}
ul.products li.product img {display:none;}
width: 100%;
height: auto;
padding: .53em;
display: block;

Reply

Alan December 28, 2013 at 5:53 am

Hi Teddy;

Thank you so much for your help and all of your tutorials have been very helpfull.
I have one question to ask please. Is it possible to have a short description displayed for each product in Mystile theme "shop page"?
I'm trying to design a vertical menu for a restuarant online ordering which is part of my university project. I have spent so much time on this but i'm not able to do it. I would very much appreciate your help.
I would like to achieve something similar to the following.

Tikka Masala
Cooked with almond powder and fresh cream sauce $10.00 Add "Button"

Chicken Curry
Cooked with mushrooms and fresh cream sauce $10.00 Add "Button"

All i have left to do is to display a short description for each product and also the layout to be vertical menu rather than in blocks.

Thank you
Alan

Reply

Teddy Triton Teddy Triton December 29, 2013 at 2:20 pm

Hi Alan,

Thanks for the positive feedback on our tutorials. Adding a short description to the woocommerce Shop page is something I've not yet tried to do. It's most likely possible but I'll have to test it out on a demo site. Please feel free to post your question in our brand new Upload WP Community Forums. There's a good chance that someone in our community will be able to point you in the right direction. Here's the link… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

Reply

Alan December 29, 2013 at 6:07 pm

Hi Teddy,

i have created an account at WP Community Forums, however i don't know how to post questions as i can't see any options to do so.
Sorry for bothering you.

Thank You
Alan

Savidge4 February 17, 2014 at 2:48 am

The only way that I could think to achieve this would be hard code.

The category page with the products inside it is:
woocommerce > templates > content-product.php

You then want to find:
<h3><?php the_title(); ?></h3>

Right below that you would want to enter:
<br /><?php echo apply_filters( 'woocommerce_short_description', $post->post_excerpt ) ?>

Teddy, BTW… Thanks for the killer resource!

Tanya December 18, 2013 at 10:46 am

Hi Ted, is it possible to remove navigation bar in Artificer child theme following this tutorial? I'm trying to build my website and your tutorials are amazing! Thank you.

Reply

Teddy Triton Teddy Triton December 24, 2013 at 7:36 am

Hi Tanya,

I've not tested it with the Artificer theme but go ahead and give it a try. It shouldn't cause any issues if you're using a child theme. It will either work or it won't. If it doesn't work,here's the Fiverr gig that will do it for you for $5…

http://fiverr.com/rashidrupani/fix-your-wordpress-css-issue

Reply

Jerry O December 20, 2013 at 9:03 am

Hi Teddy, first off I'll not speak to a guru without commending him for his works. Your videos has really helped me. I learnt a lot from the tutorials, as you can see artigianiuomini.com is almost done. It just needs to be uploaded with the actual product and paypal link.
But three bugging issues I have are: (1) How do I reduce the space above & below the primary menu (2) How do I make the Image on my home page have no square boarder, I just want it flat & plain without grey color boarder edges. I designed the artwork myself on A.I and PS and trust me every thing I have done to save it as a transparent background without boarders has not worked. (3) You have helped me achieve the building of a classic apparel website which I personally want to have control of Teddy. Thanks once again!
Seasons greetings and awaiting your response.
Jerry

Reply

Teddy Triton Teddy Triton December 20, 2013 at 1:23 pm

Hi Jerry,

Thanks very much for the positive feedback and complements. Your support is greatly appreciated! In regards to your three questions, I'll take some time tomorrow to look into them. At the moment, I'm getting ready for a long drive from FL to WI to visit family for Christmas. However, I wanted to acknowledge that I did get this and will work on answers for you when I'm done traveling.

Thanks again for your support!

p.s. we're in the process of creating top-notch WordPress and WooCommerce Community Support Forums. Although we have not yet officially launched, please feel free to take a sneak peak and register if you'd like. In the near future we'll be using that as our primary support method. Here's the link… http://uploadwp.com/community/index.php

Reply

Samantha January 2, 2014 at 5:10 pm

Hey Adam! Can you tell me how to make the first header of a drop down box containing secondary menu pages located on my navigation menu to where you cannot click it and you can only click on the secondary menu pages listed below? Thanks for your help!

Reply

Teddy Triton Teddy Triton January 5, 2014 at 1:44 pm

Hi Samantha,

Thanks for your question. Have you found a solution to this issue yet? If not, please post it in our new Community Forums here… http://uploadwp.com/community/index.php

If you do use the forums, please include screen captures that highlight the issue. That will help me as well as other community members find a solution. Thanks.

Reply

Rikke Hansen January 8, 2014 at 7:43 am

Hi Teddy,

I've seen a lot of your videos on youtube, so first of all; Thanks for all the help so far!!

Now, after setting op my Mystile theme and WooCommerce and putting in just a few products, I decided to change the font of the sitename. When I find the new font and click the "Save all changes" nothing happens on my homepage when I update it…why is that?
And is it possible to make a dropdown on the "Shop" for people to go straight into a product category?

Thanks in advance!

Best regards
Rikke Hansen, Denmark

Reply

Teddy Triton Teddy Triton January 8, 2014 at 7:32 pm

Hi Rikke,

I'm happy to hear our tutorials have been helpful. You can create a drop-down on the Shop page by setting up Custom Menus. In the WordPress admin go to Appearance > Menus and there you can create custom menus so you have a drop-down for Shop with your product categories. Please use the Upload WP Community Forums to post your question on font change. By posting in the Forums you'll get help from many people. Here's the link… http://uploadwp.com/community/index.php

Reply

ALBERTO January 10, 2014 at 2:08 am

Hello,
Thanks for your videos, they are very useful for me.
I have installed the childtheme however I have got a problem: The menu doubles the home page with a page called "54" and I can not find the way to remove it. Could you help me please?

Reply

Teddy Triton Teddy Triton January 10, 2014 at 7:56 am

Hi Alberto,

Can you provide a screen capture of the issue? That will help us trouble shoot it. Please post it in our Community Forums here… http://uploadwp.com/community/index.php

Reply

Siebren January 14, 2014 at 4:06 am

Hi Teddy,

I have a small problem with my menu. When I hover over the menu, I get a block that is to big.. Where can I change the size of this block?

Thanks in advance,

Siebren

Reply

Teddy Triton Teddy Triton January 14, 2014 at 7:40 am

Hi Siebren,

Please post your question in the Upload WP Community Forums here… http://uploadwp.com/community/index.php?threads/mystile-theme-customizations.23/

Please include a screen capture of the block you're referring to and we'll do our best to get you an answer. Thanks

Reply

ivie January 18, 2014 at 3:41 am

Hi Teddy,
I'm a novice in wordpress and thanks for this awesome site for all the tips. It have saved me a lots of time!

i'm trying to centre my logo and nav menu on my website but it keeps aligned to the left of the page. would you be able to advise?

looking forward for your help

Reply

Teddy Triton Teddy Triton January 18, 2014 at 7:46 am

Hi Ivie – Thanks for letting me know our tutorials have helped you save time in building your website. To better help you and others that might have the same question, please post your question on centering your logo in the Mystile theme in our new Upload WP Community Forums. Specifically, please post your question here… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

Reply

Malin January 24, 2014 at 3:15 am

Dear support…

…I have managed to delete my checkoutpage. No backup, the page is new and I dont seem to be able to get it? What can I do to get it back?
Im frantic here !

Thank you for your help

Reply

Teddy Triton Teddy Triton January 24, 2014 at 7:47 am

Hi Malin,

Have you tried creating a new /checkout page? Then on that new checkout page use the short code… [woocommerce_checkout]

Then go to WooCommerce > Settings > click the "Pages" tab > make sure "Checkout Page" is set to the right page.

Give that a try, if you still can't get it, please use our Upload WP Community Forums to post a followup question. Here's the link to our forums, that where we're encouraging everyone to post WP / woocommerce questions… http://uploadwp.com/community/index.php

Reply

Malin January 25, 2014 at 5:29 am

Thank you for your help… I will try your option and will be back if it doesnt work :)

Reply

Mike January 24, 2014 at 4:15 pm

Hi,

First off awesome videos and lessons! I appreciate your hard work. On my site, I tried the "Remove Mystile theme Main Navigation and Replace with top right Widget Section" tutorial but following all the instructions this appears on my site:

"Warning: current() expects parameter 1 to be array, null given in /home/fayebo5/public_html/wp-content/themes/Mystile Child Theme/header.php on line 51"

It appears on the very top. I'm not sure what to do, I copied and pasted the html stuff, but one issue that it might be is that I am using a Mac. Macs don't have notepad++ but they have Text Wrangler (which is the same from what I've read). Not sure if that is it or something else, can you help me out?

Thanks in advance,

Mike

Reply

Teddy Triton Teddy Triton January 28, 2014 at 7:34 am

Hi Mike,

Make sure you're pasting the code in the functions.php file below the dotted line that says, "All child theme functions go here". If you still have issues with this, please post in our WooCommerce Forums here… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

I'll do my best to walk you through it in the forums. Thanks

Reply

zeus February 6, 2014 at 11:00 am

Sir, how to remove of minimize this white space.

Reply

Teddy Triton Teddy Triton February 9, 2014 at 10:44 am

Hi Zeus,

Please use the Upload WP Forums and provide more detail (screen captures if possible) of the white space you're looking to reduce. Here's the link to our forums… http://uploadwp.com/community/index.php

Thanks

Reply

Nathan February 8, 2014 at 7:18 pm

Hi
Thank you for your tutorial, I have been through it and have found it helpful. There is one issue I am unable to solve, perhaps you could help me, please.

I am unable to display the mystile theme to work correctly.

I have added an image to the mystile standard homepage to show any content at all.

Only the header and the footer

No image, no slider nothing…

Ive tried using the default homepage and Ive added an ticked the box, added an image, removed the text in the lower bars – still nothing showing on the default home page.

I also created my own page, assigned a custom url in the navigation

while I can see my content on the page, them moment I set the static page to this page , nothing again.

PLEASE HELP!!!

is there an email I can send the login details to safely please

N Kelly

Reply

Teddy Triton Teddy Triton February 9, 2014 at 10:33 am

Hi Nathan,

I took a look at your site and I see content on the homepage. However, it looks like the issue you're having is with the content Slider / Image slider. Is that correct?

If so, please provide more specific details of exactly what the issue is (include screen captures) so that we can help you work through it. However please don't respond here. Instead, use our Community Forums. Using the forums we'll better allow us to help you and it will help other people that are experiencing a similar issue.

Please post your response in the following forum… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

Thanks and I'll I see ya in the Upload WP forums.

Reply

John February 9, 2014 at 3:56 am

Hello Teddy.
How do I translate "Items" at the top of the Mystille page?
I have already translated "Checkout" and "Search". But I can not find how I rename "Items". Thanks for your great post.
Many greetings
John

Reply

Teddy Triton Teddy Triton February 9, 2014 at 10:26 am

Hi John,

Thanks for your question. I'm looking at my Mystile demo site but I'm not seeing "Items". I do see, "1 item in your shopping car" when I hover over the cart icon but I'm not seeing "Items". Please provide more specific details in terms of where you're seeing "Items" and I'll do my best to help.

However, please don't post here. Instead, use the Upload WP Community Forums to post your reply. Specifically, please post in the following forum and provide as much detail as possible…

http://uploadwp.com/community/index.php?threads/mystile-theme-customizations.23/

Reply

John February 9, 2014 at 2:37 pm

Hi Teddy!

Sorry, I will try again. Unfortunately I could not write in the forum. When I try seems "(You having insufficient privileges to post here.)"

Here is a screenshot: http://i.imgur.com/dcxmCoy.png

As you see, I have already translated "checkout" to "Kasse" and "Search" to "Søg". Now I to have translate "items" to "Varer". I use WooCommerce in Mystile.

I hope you will forgive me for not inserting it in the forum. Thanks again for the many advices. You have my full respect.

John

Reply

Teddy Triton Teddy Triton February 11, 2014 at 6:57 am

Hi John,

Please try one more time to post in the forums. I went in and manually approved your account so you should be able to post now. Let me know if you have any issues with it. Thanks and I'll see you in the forums.

Reply

lemonthirst February 11, 2014 at 2:06 pm

Hi!
I've been searching for an article related to use on this theme, and here it is. The woo documentation isn't to great. Thank you!

Reply

Savidge4 February 17, 2014 at 3:39 am

Just thought I would throw this out at you. I just so happen to be reading your 'White Space Change and Social Media Plug-in' Thread over at http://uploadwp.com/community/index.php?threads/mystile-homepage-white-space-change-and-social-media-plugins.49/ and happened to notice a nice little code piece.

I know from reading here on a regular basis, people ask to decrease the white space across the top and bottom of the header section in Mystile, Myself being one of the folks looking for the answer. This little piece of code has been driving me close to crazy!

Well like I said, I saw your tutorial, and just placed the CSS code in, and low and behold… the bottom gap closed in. THAT has been the piece I have been missing! So if you try:

#header {
margin: 0px;
padding: 0px!important;
}
#header #navigation,
#header hgroup {
margin: 0px;
}

You will see that it slams everything nice and tight to the top and closes in the bottom… It's a beautiful thing!

You are the BEST!

Reply

Teddy Triton Teddy Triton February 17, 2014 at 9:19 am

Thanks so much for the support and for sharing this with the Upload WP Community!

Reply

David C. Thornton February 17, 2014 at 2:02 pm

Can't get rid of duplicate Home tabs in navigation, no matter what I do. In following directions, I created custom menu but when I deleted title of Home page it justtappears as untitled 311 or something similar. I'm stuck. David

Mystyle Theme

Reply

Teddy Triton Teddy Triton February 17, 2014 at 3:03 pm

Hi David,

Try this… Install the "PageMash" plugin. In the WordPress admin go to: Plugins > Add New > search for "PageMash" > install

Then go to: Pages > pageMash and there you'll be able to hide the duplicate homepage / prevent it from showing in the navigation.

If you still have issues with it, please post in the Upload WP Community Forums here… http://uploadwp.com/community/index.php

Reply

Joe February 17, 2014 at 2:15 pm

Hello Teddy.

Thanks for your tips and tricks. I hope you can help me. My problem is that my images and sliders on my static homepage cannot be bigger than the following – here is a screenshot: http://i.imgur.com/zv6juMd.png

I use Mystile and the settings for the page is "Full Width". I have tried with different images in different sizes, but it helps nothing.

Best regardes
Joe :)

Reply

Teddy Triton Teddy Triton February 17, 2014 at 2:59 pm

Hi Joe,

It's sounds like you're trying to make the image slider the full width of the site… Is that correct? Please provide as much info as possible, including your site url and the slider you're using. However, instead of responding to this comment, please use the Upload WP Community Forums. Specifically, start a new thread in our "WooCommerce Themes" forum here… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

Reply

Savidge4 February 20, 2014 at 2:24 am

As I am working on my Mystile's site, I am …stumbling… on all kinds of little tricks for Mystile. I have seen this one is in great demand… Changing the Footer Widget Box Color.

#footer-widgets {
background: #000000;
padding:20px;
margin-left:-30px;
margin-right:-30px;
}

Since it looks a bit odd to have a floating box, here is how to change the Footer Color as well.

#footer {
background: #000000;
padding:20px;
margin-left:-30px;
margin-right:-30px;
}

Hope that Helps!

Reply

Teddy Triton Teddy Triton February 21, 2014 at 7:12 am

Thanks for sharing!

Reply

benjamin February 24, 2014 at 9:46 am

Thanks for sharing this info. I am working on reducing the size of the banner for Mystile. I am not sure whether you have noticed that the banner display differently for the following code .homepage-banner { width:90.5%!important} 

Safari/firefox can display ok
chrome still too big until you put .homepage-banner { width:60.5%!important} 

Is there a solution for cross browser banner? Thanks.

Reply

benjamin February 24, 2014 at 1:47 pm

I guess I may know what is the reason, I am using imac with resolution 1920*1280. Since mystile is responsive, I think the banner just go with the screen size. Can you advise how to restrict the banner size in higher resolution?

Reply

Teddy Triton Teddy Triton February 25, 2014 at 7:04 am

Hi benjamin – Thanks for your question on reducing the size of the Mystile banner. To better help you and others that have the same question, please post it in the Upload WP Community Forums. Specifically, please post it in the following WooCommerce Themes forum here… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

Thanks and I'll watch for you in the forums.

Reply

sujata March 9, 2014 at 4:03 pm

I cannot change the location of logo on my homepage of mystile theme. its too far on the top of header on the left. I want to move it to center on the left of header or on bottom on the left of header. can u please help ? \
thank you.

Reply

Teddy Triton Teddy Triton March 10, 2014 at 6:56 pm

Hi Sujata,

Thanks for your question and please check back in a couple days. We're close to launching a new tutorial on the Mystile theme that should help answer your question on centering the logo.

Reply

Arvin March 11, 2014 at 7:09 am

Hi I'm just starting to play around with the mystile theme. I was wondering in your tutorials, did u cover scrolling images as the main banner image instead of a static one?

Reply

Teddy Triton Teddy Triton March 11, 2014 at 7:57 pm

Hi Arvin,

We've not yet done a tutorial on that but we definitely need to. Thanks for the suggestion and please consider joining the Upload WP Forums here… http://uploadwp.com/community/index.php

Reply

Mike March 18, 2014 at 1:53 am

How/where do I change the font of the product label on the categories and product pages please

Reply

Teddy Triton Teddy Triton March 18, 2014 at 1:00 pm

Hi Mike,

Please refer to the following Upload WP forum… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

If you don't find an answer there, please join and create a new thread. Most likely, one of our forum members will get you an answer fast. Thanks

Reply

malin March 24, 2014 at 1:34 pm

Hello there, and thank you for all your help… its very appreciated.
I have a problem I can't find a solution for. Am trying to get rid of the page name, but if I remove it, the actual navigation name disappear… ? How can I keep the navigation and just get the page name to go away, which is showing up on every page underneath the menubar?
Greatful for help !

Reply

Teddy Triton Teddy Triton March 24, 2014 at 5:39 pm

Hi Malin,

Thanks for the positive feedback. I'm happy to hear that our WordPress and WooCommerce tutorials have helped. Please take a few minutes to review the threads in our WooCommerce Mystile Theme forums here… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

Feel free to join the Upload WP Community Forums. It's free, easy and you're sure to find solutions. Thanks

Reply

deepak April 4, 2014 at 9:15 am

Hi..can u plz tell how to make my site more attractive. I am using mystile themes which has many white space in top and in footer. I don't no how to add background image for my site so u plz help me.. my site is efetcher.in i am looking for your reply.. thanks.

Reply

Teddy Triton Teddy Triton April 7, 2014 at 11:11 am

Hi deepak,

Check out our WooCommerce Themes forum. There you'll find a bunch of threads on customizing the Mystile theme… http://uploadwp.com/community/index.php?forums/woocommerce-themes.7/

Reply

Teddy Triton Teddy Triton August 15, 2013 at 11:36 am

Hi Granzina,

In the WordPress admin, when you go to the "Edit Product" page you're not seeing the purple and blue "Woo" shortcode icons? Make sure the "Visual" tab is selected and you're displaying the full kitchen sink. That's strange that they are not showing. Also, the issue with you're homepage banner image not showing is weird given that it sounds like you're doing everything the right way. If you'd like to create a user account for me to access the WP admin I'd be happy to take a closer look and hopefully solve both issues. You can use the "Contact" page form (link in footer of UploadWP.com) to securely send me the login credentials. That form goes to my email.

Reply

Teddy Triton Teddy Triton November 27, 2013 at 2:09 pm

I've not yet figured out how to recreate that light bar above the homepage featured banner image. If anyone out there knows how to recreate the light colored line that's just above the Mystile featured banner image please share it with us here. Thanks

Reply

Teddy Triton Teddy Triton December 7, 2013 at 1:41 pm

Hi Sam,

So the Mystile homepage featured banner image you uploaded looks good in IE but not in Chrome? Have you tested it in Firefox? Make sure the image you upload is at least 1165px wide. I tested some of my Mystile demo sites in Chrome and have not been able to recreate the issue.

Reply

Teddy Triton Teddy Triton December 7, 2013 at 1:48 pm

Hi Sam,

The reason we used a custom link for the homepage in that video is because… We were using a static homepage (adjusted in Reading settings) and by default the Mystile already displays a Home link in the main Navigation. So we wanted the new Home link to go to our custom static homepage and that's why we created a custom link in that specific example. Let me know if that helps answer your question.

Reply

Teddy Triton Teddy Triton December 12, 2013 at 9:21 pm

Hi Megan,

It's sounds like you've done everything the right way the the homepage banner image is still not showing. I know how frustrating seemingly simple things like that are, especially when you're doing everything the right way. If you'd like to create a user acct and have me take a look I'm happy to do that. Or, you could use my friend Jason's gig on Fiverr and I'm sure he'd get it resolved for you quickly. Here's the link to his gig… http://fiverr.com/jasonbshepard/help-with-wordpress-woocommerce-store

Reply

Teddy Triton Teddy Triton December 13, 2013 at 5:09 pm

Unfortunately no luck yet Chris. We're getting close to launch our Upload WP Community forum and I will post your question then when it launches. Chances are good someone in the community forum will help us solve it.

Reply

Teddy Triton Teddy Triton December 30, 2013 at 9:28 am

Hi Alan,

You should have received an email to confirm your account. In that email is a confirmation link. Once you click that you'll be able to post questions. I see your account as pending so I'll go ahead and manually approve you now and you'll be good to go.

Reply

Chris Furness January 23, 2014 at 5:04 pm

Hi Teddy, had a look through the forum and I couldn't find the question. Could you give me a pointer please? Thanks.

I'm still interested in achieving this.

Chris

Reply

Teddy Triton Teddy Triton January 24, 2014 at 7:57 am

Hi Chris,

Please take a look at the following thread in our Upload WP Community Forums… http://uploadwp.com/community/index.php?threads/mystile-homepage-white-space-change-and-social-media-plugins.49/

That will show you how to add a custom widget section to the header of the Mystile theme without eliminating the main navigation. It should allow you to add the message board you're looking for. The code and instructional video on how to do it is in that thread. Let me know if that helps.

Reply

Leave a Comment

Previous post:

Next post: