Having Trouble Adjusting Site Description In Theme

[Mulsiphix]

I would like to modify a non-ProSilver style: Simplicity. I was able to find this:

Code: Select all

styles/prosilver/template/overall_header.html

found this:

Code: Select all

<div id="site-description" class="site-description">
    <a id="logo" class="logo" href="<!-- IF U_SITE_HOME -->{U_SITE_HOME}<!-- ELSE -->{U_INDEX}<!-- ENDIF -->" title="<!-- IF U_SITE_HOME -->{L_SITE_HOME}<!-- ELSE -->{L_INDEX}<!-- ENDIF -->"><span class="site_logo"></span></a>
    <h1>{SITENAME}</h1>
    <p>{SITE_DESCRIPTION}</p>
    <p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
</div>

This establishes my baseline. Now I will compare it to Simplicity:

Code: Select all

styles/simplicity_3.2.7/simplicity/template/overall_header.html

Code: Select all

<div id="site-description" class="site-description">
   <a id="logo" class="logo" href="<!-- IF U_SITE_HOME -->{U_SITE_HOME}<!-- ELSE -->{U_INDEX}<!-- ENDIF -->" title="<!-- IF U_SITE_HOME -->{L_SITE_HOME}<!-- ELSE -->{L_INDEX}<!-- ENDIF -->"><img src="{T_THEME_PATH}/images/logo.png" data-src-hd="{T_THEME_PATH}/images/logo_hd.png" alt="{SITENAME}"/></a>
   <p class="sitename">{SITENAME}</p>
   <p>{SITE_DESCRIPTION}</p>
   <p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
</div>

This is as far as I have gotten. I'm not sure how to get the Site Description to appear on the Simplicity forum. Here is a picture of what I'm hoping to add to Simplicity.

[DTMWC]

In the stylsheet css file simplicity/theme/stylesheet.css, look for line: 206,

Code: Select all

 .site-description h1, .site-description p {
    display: none;
}

If change that to display: block; the site description and site name will appear.

If you only want the description and not the site name - you would split the 2 so it becomes this:

Code: Select all

 .site-description h1 {
    display: none;
}

.site-description p {
    display: block;
}

[Mulsiphix]

That is awesome! Thank you so much

Okay, so I've modified the code and the Forum image is appearing over the Site Description. It is possible to mimic the style of prosilver, where the image is to the left and the text is to the right?

[DTMWC]

No problem,

To put the logo on the left, you need to make these edits to the style sheet,

Around line 201, find:

Code: Select all

.site-description {
  text-align: center;
}

Change it to:

Code: Select all

.site-description {
  float: left;
  width: 65%;
}

Around line 188, find:

Code: Select all

.logo {
  display: block;
  box-sizing: border-box;
  max-width: 100%;
  padding: 10px 0;
}

Change it to:

Code: Select all

.logo {
    float: left;
    width: auto;
    padding: 10px 13px 0 10px;
}

After making these changes, you will notice when the screen is minimized to less than 700px just the logo will be there on the left side - but on prosilver it's just the site name in the center and no logo.

You can basically have any of the logo, site name, site description or all of them or 2 of them there

[Mulsiphix]

It works perfectly! Truly, thank you so very much