Setting up theme

Support Area Forums Umami Setting up theme

This topic contains 18 replies, has 2 voices, and was last updated by  Bill Robbins 3 years, 8 months ago.

Viewing 19 posts - 1 through 19 (of 19 total)
URL to the page in question: http://2tecguys.com
  • Author
    Posts
  • #34283

    albert dashevsky
    Participant

    So I install the theme…..and then what?

    Where are the instructions?

    How do I make my site look like your advertised theme?

    Very frustrating!

    #34284

    Bill Robbins
    Moderator

    Hi Albert,

    The link to each theme’s instructions is in the right hand side of the site here. The direct link to Umami’s instructions is https://support.organizedthemes.com/umami/

    You can also use the sample content from the demo to get started if you’d like. The page where you can download it is at https://support.organizedthemes.com/sample-data/. Since WordPress separates content (pages and posts) from presentation, installing a new theme won’t instantly make the site exactly like the demo. That’s ultimately a good thing because you can update the look of an existing site without having to redo all your content.

    That’s also why we make the demo content available. So if you have a new site and you’d like to use the demo as a starting point, you can.

    If you have questions as you get set up, let me know.

    Take care,
    Bill

    #34285

    albert dashevsky
    Participant

    How do I set it up that the home page just shows the backround image and the sidebar?

    #34286

    Bill Robbins
    Moderator

    In your WordPress dashboard, go to pages and select the add new page link. Give the page a name, but don’t enter any content into the content box. Then publish your page.

    Next go to the settings section of your WordPress dashboard and click on Settings and then choose Reading. At the top of this screen you can select what your front page displays. Choose the static page option and use the drop down menu there to select the page you just created as your front page. Then update your settings.

    That’ll set your front page and have it only be a sidebar.

    #34287

    albert dashevsky
    Participant

    Thanks! I’m slowly getting the hang of this. Why is my background image getting cut off?

    #34288

    Bill Robbins
    Moderator

    Great question,

    The background image will always fill the background of the browser window. In order to do that without skewing the image, some of it may get cropped. How much is cropped will depend on how similar the aspect ratio of the image is to the aspect ratio of the browser window.

    It generally works best to have the main focus of the image be close to the center with a bit of buffer before th edge. That way if anything is cropped, it won’t be anything important.

    Bill

    #34289

    albert dashevsky
    Participant

    How do I create a submenu to appear when the mouse hovers over a menu title?

    #34290

    albert dashevsky
    Participant

    Also, in the contact widget, how do I make my email a link so it can be clicked on and taken to the email app?

    #34298

    Bill Robbins
    Moderator

    Good Morning Albert,

    I hope you had a nice Sunday. You’re welcome to have a “hover” based menu instead of one that opens by clicking. There’s a support topic at https://support.organizedthemes.com/forums/topic/open-navigation-menu-by-default/ that can show you how to set that up. It’ll replace the default menu with one that is similar, but opens up via hover.

    To make an item a sub-menu item in the navigation builder, place it just below the item you’d like to have as the parent. Then drag it slightly to the right and it’ll indent just a bit. That will indicate that the item is now a sub-menu item.


    In the contact widget, just below the address options, you’ll see ones for phone and email. The first phone one is what will display on the front of your site. The second one is just for numbers and will be used by mobile devices for calling. The email address one will be active link on the front end of your site.

    If you run into trouble or questions, let me know.

    Thanks,
    Bill

    #34303

    albert dashevsky
    Participant

    Great, thanks for the help thus far!

    I really don’t like the navigation menu. And being that most users today are on mobile, unfortunately they will not be able to see the hover menu. Is it possible that the mobile users can see a regular sidebar menu and that users above 1024 px will see the hover menu?

    #34304

    Bill Robbins
    Moderator

    On Mobile (smaller than 1024px), the click menu will be what users see instead of the hover one. If you would rather, we could set it so the custom nav widget is what’s visible on smaller screens. If you’ll add that widget back to your sidebar and let me know, I can send you over instructions on how to do that.

    #34305

    albert dashevsky
    Participant

    yes thats exactly what I would like!

    #34306

    Bill Robbins
    Moderator

    Fantastic. Just let me know when you have that widget added back to the sidebar. Keep the current menu where it is too. Then I can send back the instructions on making them show up at the appropriate sizes.

    #34319

    albert dashevsky
    Participant

    Done.

    #34324

    Bill Robbins
    Moderator

    Thanks. See how this works for you:

    1. Go to your theme options page and choose the Advanced tab.
    2. Scroll down to the Custom CSS box and add this:
      
      @media only screen and (min-width: 1024px) {
      
      	#sidebar .widget_nav_menu {
      		display: none;
      	}
      
      }
      
      @media only screen and (max-width: 1023px) {
      
      	#sidebar .widget_nav_menu {
      		display: block;
      	}
      	
      	#sidebar nav#side-menu,
      	nav#header-menu {
      		display: none !important;
      	}
      
      }
      
    3. Update your settings.

    Let me know if you run into trouble there.

    Bill

    #34325

    albert dashevsky
    Participant

    Looks like it works. Thanks!

    When I look at the site from my phone, the menu names are so close together, one right on top of another, how do I make it so it looks like it does on a desktop, a little more spaced out?

    #34326

    Bill Robbins
    Moderator

    Try adding this to the Custom CSS too to adjust the spacing there:

    
    #sidebar .widget_nav_menu li {
    	margin-top: 7px;
    }
    

    See how that works for you now.

    #34327

    albert dashevsky
    Participant

    Great, that works!

    So I changed the sidebar font size to “20”. Everything looks nice and even on mobile phone. However on my laptop, the hover menu seems like it’s still smaller. How can I adjust this? thanks.

    #34333

    Bill Robbins
    Moderator

    With the default menu replaced, the built in control for size may not make a change here. You can use this to adjust the menu size on larger screens:

    
    ul#primary-menu li {
    	font-size: 20px;
    }
    

    Just change the 20px to the size you’d like to have there and that should do it. If you need to change the smaller screen menus you can use this:

    
    ul#menu-main-menu li {
    	font-size: 20px;
    }
    

    Have a great day,
    Bill

Viewing 19 posts - 1 through 19 (of 19 total)

The topic ‘Setting up theme’ is closed to new replies.