TibbyWeb

That could be due to “CSS Specificity”, which means that other CSS in the theme is overwriting your code. Adding “!important;” usually helps with that, but not always.

I have to go now, but I’ll try to look at it tomorrow.

Cheers!

TibbyWeb

Glad it helped! ??

Regarding the font awesome you can add it via CSS:

.onepress-menu li:first-child a:before {
  font-family: FontAwesome;
  content: "\f003";
  margin-right: 8px;
}

(for the bold envelope use \f0e0.)

This CSS will add the icon to the first menu item, so it will work as long as the email address will be always first.

The better solution would be to use the ID of the menu item (which I can’t know without seeing your page or you can check it yourself by using the inspection tool in your browser).

So if, for example, the menu’s item ID is 4783, then you could use this code:

#menu-item-4783 a:before {
  font-family: FontAwesome;
  content: "\f003";
  margin-right: 8px;
}

That would make the icon always attached to the email address.

Hi,

Isn’t the menu font already 600 by default?

Maybe try 700, 800 or 900.

If it won’t help try adding “!important” to the end of line, eg:

font-weight: 700!important;

TibbyWeb

Hi,

Add it as a menu item:

1. Go to your menu in Appearance / Menus;

2. Click on “Custom Links” on the left;

3. URL field: remove “https://” and insert “mailto:[email protected]” (without quotes and change the email address to yours);

4. Link Text: as you want it to look on the website, eg. “[email protected]”;

5. Add to menu and move it above other links, so it’ll show first, on the left.

Let me know if you have any troubles with it.

Cheers!

TibbyWeb

Hi,

Try adding this CSS code:

.hentry .title-post {
    font-size: 70px;
}

Hope it helps,

TibbyWeb

You’re welcome!

Hi raymondhcw,

Try this one:

.site-header-cart .widget_shopping_cart {
    background-color: gray!important;
}

TibbyWeb

This CSS may help:

.post-type-archive-product .header-post-title-container {
	display: none;
}

Hi acanniere,

Try this code:

.page-header {
    border: none!important;
}

tibbyweb

That’s great! ??

Hi Subasubamax,

To make the background a little bit gray try adding the code below. If it’s still too light change #FCFCFC to #F9F9F9.

body, #sub-header, #header {
    background-color: #FCFCFC!important;
}

For moving the box down the CSS is:

#call-out {
    margin-top: -40px;
}

If you want to push it totally below the photo, then use 0 value:

#call-out {
    margin-top: 0;
}

(Just play with the number to make it fit as you wish.)

Hope it helps!

Try to add this code to your CSS, to push the menu to the second line:

@media only screen and (max-width: 1024px)
.wrap {
    width: auto!important;
}

Website speed optimisation is a huge topic but really worth to learn it if you’re building websites for clients. You can start are:

https://codex.www.ads-software.com/WordPress_Optimization
https://developers.google.com/speed/

I must say that the choice of a good hosting provider can make a huge difference; even 10 seconds or more.
Right now I’m moving out of Bluehost and testing other options so I’m not sure yet which to recommend, although I’m guessing that Amazon AWS will be the best.

Good luck! ??

Awesome it worked!; glad it helped ??

I think I found a simpler solution; I just compared the original theme settings to yours and it seems that you have disabled the preloader. By default it’s set on and so there is a little icon showing for a second, which is waiting for the page to load, before showing it.

Thus if you would like to turn it on, go to:
Appearance/Customize/General Options/General/ and tick off “Disable preloader”

Now the page should load as the original theme does, without the gray background.

Hope that helps,

TibbyWeb