Website customization

David Girard

Has anyone done any major enhancements to their website?? Just new here and looking to implement some custom CSS/Javascript and was wondering if anyone else had done any of the following and could provide some code samples?

Add Custom Google Fonts? Seems to be a limited number of font choices. Implementing new fonts should be fairly easy, but how about replacing existing fonts?
Colors - All I can see is various palettes. I would like to customize the colors for different sections, headers, fonts, etc.

Any code samples appreciated!!

Danny Eiden

Hi David,

Add Custom Google Fonts? Seems to be a limited number of font choices. Implementing new fonts should be fairly easy, but how about replacing existing fonts?

As you mentioned, MyVR offers a selection of fonts out of the box. If none of them suite your needs, you can try using the following custom <HEAD> HTML

<link href="https://fonts.googleapis.com/css?family=Pacifico&display=swap" rel="stylesheet">
<style type='text/css'>
  .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, 
  header.navbar .top-level-nav ul.navbar-nav li a,
  .btn,.btn.rounded-bigger {
      font-family: 'Pacifico', cursive !important;
  }
</style>

This snippet is specifically for the following Google font, but it should be usable with others.

0_1565982704765_Screen Shot 2019-08-16 at 12.10.09 PM.png

The above code will use the custom font everywhere that the font selector in the design editor applies your selected font (e.g. buttons, headers).

Colors - All I can see is various palettes. I would like to customize the colors for different sections, headers, fonts, etc.

As you mentioned, you can select from a few pre-made color palettes which are designed to work well together. You can also fully customize an accent color for your palette within the design editor.

0_1565981829675_Screen Shot 2019-08-16 at 11.52.46 AM.png

You can also fully edit the text color of different headers and content blocks within the content editor.

0_1565981874973_Screen Shot 2019-08-16 at 11.55.07 AM.png

Finally, you can attempt to use CSS to go fully custom. Generally, we only recommend changing a few key components via custom CSS. We do not recommend fully styling your website with custom CSS, as the underlying templates of our websites are not guaranteed to stay the same.

By the way, with the level of customization you are looking for, you might be interested in hiring a developer to build you a custom website using MyVR.js.

Cheers,
Danny