Home>Support>Origami title, menu modifications

Origami title, menu modifications

By Ed Brownson, 10 years ago. Last reply by Andrew Misplon, 10 years ago.
Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].

I am modifying Origami for a simple photography/blog website and I have some modifications I need to make.

I want to modify the header area as follows:
– reduce the font size of the site title,
– moved the menu to the right of the site title, and
– reduce the amount of space devoted to the header area, thereby leaving more room for pictures.
– remove the page title, at least on the page displaying a slider.

I’d also like to widen the area devoted to pictures and probably the width of the theme itself.

Thanks for any help.
EdB

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 1 month ago Ed Brownson

    I upgraded to premium Origami today and have been working on my site. I’ve solved some of the problems indicated in my first post, though I’m not sure in the best way.

    – I changed the font size of the title (“logo”) by modifying the #logo h1 in style.css. Would it be better to do it in the CSS editor with Premium? If so, what’s the correct syntax? Is there a guide to adding css changes to the editor?
    – I removed the page title.
    – Figured out how to decrease the padding around the menu.

    What I haven’t done is figure out how to put the title/logo on the same line as the Menu, or at least put the title/logo and tag lines on the same line. My goal is to tighten up the top of the main screen so picture slider can have prominence.

    Thanks for any help!
    EdB

  2. 10 years, 1 month ago Andrew Misplon
    Hi, I Work Here

    Hi Ed

    Thanks for your support. You can find our Custom CSS tutorial here:

    https://siteorigin.com/basics/modifying-theme-design-with-custom-css/

    The site title can be edited by adding the following to Appearance > Custom CSS:

    #logo h1 {
  color: #555;
  display: inline-block;
  font-family: "Terminal Dosis", Arial, Helvetica, Geneva, sans-serif;
  font-size: 52px;
  font-weight: 200;
  margin-bottom: 0.2em;
}

    You can remove the declaration lines you don’t require and edit what you want to change.

    For pages Origami has a page template called Without Page Title, that can be found in the right column. Let me know how you removed the page title and if using the page template Without Page Title will work for you.

    Please try copying the edited CSS rules for your menu padding change to Appearance > Custom CSS so they are upgrade safe.

    Here is some basic Custom CSS to start you off for moving the menu onto the same line as the logo:

    #logo {
float: left;
width: 20%;
}

#menu {
float: left;
width: 70%
}

    Hope that helps get things started.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More