1. Welcome to the Upload WP Community Forums!  This is the best place to get premium WordPress and WooCommerce support.  Please take a look around and join the Upload WP Community for FREE today!

CSS to Customize the Mystile Theme

Discussion in 'Themes & Templates' started by TeddyTriton, Mar 17, 2014.

  1. Alex Tran

    Alex Tran New Member Updated Profile

    Great! Thanks for your sharing knowledge. It is helpful for people.
  2. newbee

    newbee New Member Updated Profile

    Hi, I am new to wordpress and have just started to build my first site. Thanks all for your contribution to this forum, I have used many of the tips and CSS codes found in this thread.

    Does anyone know how to create a custom widget between the banner and footer, that will appear only on the homepage?
    I am getting the layout I want either by customising the 'footer widgit area' or by changing the primary widgit and ticking the 'display sidebar' option. In both cases the custom widget appear on all pages but I want it only on homepage.

    Hopefully the attached diagram explains better

    Anyone has any tips?

    Attached Files:

    Jame Harvey likes this.
  3. vkp

    vkp New Member Updated Profile

    Hi, Image links are broken
  4. Stu

    Stu New Member Updated Profile

    Hi Folks,

    Love that I found this amazing piece and so many people contributing.

    I have a website, used Mystile to create it and now really trying to make it look much more modern. I've done a fair amount of work on it using many of the tips and tricks I found here, but now I find myself stuck.

    Basically, I have already removed the header section, also put my logo into the top nav bar, but now I want to centre all the content in the top nav bar. What i'm looking to achieve is my logo in the centre of the page, with the other links either side. I'm almost there, but can't figure it out. I'm sure one of you geniuses will have the answer and it will be about 3 lines of css at the most, but I am pretty new to this stuff.


    Ignore the dodgy slideshow! It's going to be changed very shortly!

    Thanks in advance, and also thanks for such an incredible and useful resource for folks like me to tap into the knowledge of experience like yours!

    Also, if anyone can shed any light on why I suddenly seem to have an extra £ in the top nav menu, it'd be appreciated. It just appeared when I created my child theme.

    Last edited: Mar 26, 2016
  5. Stu

    Stu New Member Updated Profile

    So i've managed to fix this issue now. Was an issue with the child theme.
  6. vicdam

    vicdam New Member Updated Profile

    hi i have been following this thread silently and using most of the codes which have been life saving but i have a problem with my website mobile version http://petshadow.com when the menu button is clicked all pages and sub pages appear which shouldn't be as it makes it too long so i want only the pages to appear and when a page is clicked, the sub pages appear. Thank you very much in advance

    Attached Files:

  7. Savidge4

    Savidge4 Upload WP Superstar

    I totally get what you are wanting.. but not so sure there would be an easy way to do this.. just not the way Mystiles navigation works.

    The BEST method I have found for this kind of stuff is to create a seperate mobile site for phone usage... takes a bit of work, but you can share the product and article databases and basically you are just using a 2nd theme for the mobile use, so you can set up pages as you are wanting for navigation needs.
  8. vicdam

    vicdam New Member Updated Profile

    Ok thank you very much
    I have another serious problem which is that no vendor plugin works on my site
    I know it is not the theme because i was using one before so i guess i tampered with aomething and do not know
    Please without this plugin the website is useless... Thanks once again in advance
  9. vicdam

    vicdam New Member Updated Profile

    thank you very much i have been able to solve this issue
    it had to do with my plugins
  10. Storm12

    Storm12 New Member Updated Profile

    Hi All,

    First of all, thanks for this thread! Giving me sooo many ideas for my site.

    But before I can put them in place, im falling at the first hurdle. It is more than likely me missing some really simple information, but ive scanned through all the pages and either im missing the answer or im uniquely stupid :) So im biting the bullet hoping some of you guys can show me up!

    1. I dont seem to have the same settings structure as everone else. There is no custome CSS area in my mystile theme settings. I have had to install Advanced CSS editor plugin.
    2. When i put the CSS into the Advaned CSS editor in Appearance > customise it appears to work brilliantly. The summary shows my background image as i would expect. But when i save, and go to my site, i get nothing? Just the same old white background.
    3. If i use the transparent background CSS, and then set a video background with mb.YTPlayer for background videos plugin, it works! I see the video playing in the background of my site.

    Ive tried the different methods all with the same result. I tried changing the reading settings to both latest posts and static page and still i see no image. No matter if i set the background image in the mystile settings or using the CSS to place the image, i still only see it in the preview and not on the actual site.

    I hope this makes sense! And im really sorry if this has all been answered before.
  11. greenatwp

    greenatwp New Member Updated Profile

    Firstly THANK YOU to all the kind problem solvers, especially Savidge4, out there who have posted solutions on this forum. So far, just my reading others' posts, they have helped me, an ignorant newbie, to go a long way into setting up my own website. Thanks!

    Secondly can someone pleeeease help?

    I'm using Mystile and need my whole site to be white font against black background. On my checkout page, for both the state and country dropdown menus, I've changed them to black background and white font but for the life of me I can't figure out how to change the color when the mouse hovers over a country. It's white on white and the writing is invisible!
    1. please tell me what I need to do to change the color when the mouse hovers on selected country in dropdown menu
    2. please tell me how to remove that annoying bit of white on the left of the selected country/state

    My website is here:

    Thanks in advance,
  12. ams71299

    ams71299 New Member Updated Profile

    Your knowledge is very helpful.
    I have tried to change the top navigation in mystile text color to white. I am using the code, but no change appears.
    #top ul.nav > li a {
    color: #ffffff;
    If I use the mystile customizer and change the link color, it changes, but it changes all my link colors in all areas. I only need this change on the top nav and possible the footer and footer widget area.

    Please help.
    Thank you,
  13. Clemence Brighton

    Clemence Brighton New Member Updated Profile


    This is my first post. I'm fairly new to Wordpress and Mystile, and I've been enjoying it so far. I just have this one problem. I CANT get rid of the shopping cart icon in the top header. I've searched the entire internet and tried dozens of CSS-codes. It seems to work for everyone, but not me. Do anyone have an idea of what the problem might be?

    I understand it may be difficult to answer, but I'm very grateful for any help.
  14. dstackle

    dstackle New Member Updated Profile

    Hey guys, I've tried some CSS to remove some whitespace on Mystile that I've found in this thread. Unfortunately it hasn't helped me remove whitespace. See below image. I've highlighted the whitespace I'd like to remove or reduce. Your help is appreciated!

  15. joder

    joder New Member Updated Profile

    I'm trying to center the products on my category page. What ccs would you recommend? Standard CCS dosen't work for the mystile theme. I want to center the products on the category pages just like how everything is centered on my homepage.

    Go to http://www.airsoftaccesories.com/product-category/airsoft-sights/

  16. joder

    joder New Member Updated Profile

    I'm trying to center the products on my category page. What ccs would you recommend? Standard CCS dosen't work for the mystile theme. I want to center the products on the category pages just like how everything is centered on my homepage.

    Go to http://www.airsoftaccesories.com/product-category/airsoft-sights/
  17. OHM

    OHM New Member Updated Profile

    Im trying to add widgets/links/tabs to the left this of my page like in this website

    There you can see Mitsubishi, Lamborghini and so on.

    is this possible with CCS? thank you for your time.
  18. freehearted

    freehearted New Member Updated Profile

    Hi Savidge4, I have been following this thread and all your tutorials and super helpful, even for someone like me who knows zero about coding (getting rid of the blank space in the header! thank you thank you thank you!).

    I was wondering if you covered how to put a logo (mine is my avatar) alongside the nav, like this - www.wearetheportos.com. And if a similar technique would work on my other site, www.freeheartedfilm.co, which is running a child theme of Olsen Light https://wordpress.org/themes/olsen-light/. The default within the theme places the logo centered above the nav, and pushes my content below the fold.
  19. Marie Otty

    Marie Otty New Member Updated Profile

    I am having trouble with customising my header in the mystile theme. I would like to move the navigation bar down so there is less space, move the logo more to the right and add some text in the header. I ahev tried searching for some answer but no luck. Also tried some links to past threads and the links have errors so can't view those.
  20. jy123

    jy123 New Member Updated Profile

    Hello everyone, it has been a great help here!

    For the homepage Banner headline, what's the CSS needed to center the "Banner headline" words?