Home › Forums › Basel support forum › How to use Custom CSS to add into on all pages?

How to use Custom CSS to add into on all pages?

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • February 21, 2020 at 6:09 pm #175204

    oleg_dmitriev
    Participant

    Hi Elise,

    After many days of work, my http://www.independent.wine with BASEL loads in 1.2s and has 98% in GTMetrix. Nice 🙂 https://gtmetrix.com/reports/www.independent.wine/W0ehobhm

    The last bit I am struggling with – which is probably easy for you HTML ninjas 🙂 – if how to inline favicon. Please tell me how can I

    1) insert <link href=”data:image/x-icon;base64,xxxxxx” rel=”icon” type=”image/x-icon” />
    into <head> </head> on all pages?

    2) Remove the existing favicon link from the <head></head>
    <link rel=”shortcut icon” href=”https://www.independent.wine/wp-content/uploads/2020/02/favicon.ico”&gt;
    ?

    Thanks in advance!!!

    <link rel=”shortcut icon” href=”https://www.independent.wine/wp-content/uploads/2020/02/favicon.ico”&gt;

    February 22, 2020 at 5:39 am #175272

    Artem Temos
    Keymaster

    Hello,

    We are glad that you have such results with our theme, great job!

    1. You can try to copy the header.php file to the child theme folder and add your code there.

    2. Just remove the favicon from Settings and WordPress customizer and it will not appear there.

    Regards

    February 22, 2020 at 1:57 pm #175385

    oleg_dmitriev
    Participant

    Thanks!
    1. header.php
    Thanks for pointing me the right diretion!
    I actually figured out how to add a <link> to header.php last night, so I ma happy that I did the right thing :)))

    2. Remove favicon from settings
    I removed the favicon.ico from the Theme Setting -> General page.

    But this link still remains in the Basel theme code, I cannot see how to remove it because it is not in header.php. So when I remove favicon.ico from the Theme setting, it overrides and tries to provide Basel default favicon:
    <link rel=”shortcut icon” href=”https://www.independent.wine/wp-content/themes/basel/images/icons/favicon.png”&gt;

    You can see it in the view source of the page: view-source:https://www.independent.wine/

    <!–[if lt IE 9]>

    <![endif]–>
    <link rel=’https://api.w.org/&#8217; href=’https://www.independent.wine/wp-json/&#8217; />
    <style type=”text/css”>
    #wp-admin-bar-assetcleanup-parent span.dashicons {
    width: 15px;
    height: 15px;
    font-family: ‘Dashicons’, Arial, “Times New Roman”, “Bitstream Charter”, Times, serif !important;
    }

    #wp-admin-bar-assetcleanup-parent > a:first-child strong {
    font-weight: bolder;
    color: #76f203;
    }

    #wp-admin-bar-assetcleanup-parent > a:first-child:hover {
    color: #00b9eb;
    }

    #wp-admin-bar-assetcleanup-parent > a:first-child:hover strong {
    color: #00b9eb;
    }

    #wp-admin-bar-assetcleanup-test-mode-info {
    margin-top: 5px !important;
    margin-bottom: -8px !important;
    padding-top: 3px !important;
    border-top: 1px solid #ffffff52;
    }

    /* Add some spacing below the last text */
    #wp-admin-bar-assetcleanup-test-mode-info-2 {
    padding-bottom: 3px !important;
    }
    </style>
    <meta name=”referrer” content=”always”/><meta name=”theme-color” content=””> <link rel=”shortcut icon” href=”https://www.independent.wine/wp-content/themes/basel/images/icons/favicon.png”&gt;
    <link rel=”apple-touch-icon-precomposed” sizes=”152×152″ href=”https://www.independent.wine/wp-content/uploads/2019/08/android-chrome-192×192-1.png”&gt;
    <style>

    February 22, 2020 at 3:44 pm #175397

    Artem Temos
    Keymaster

    Try to add the following PHP code snippet to the child theme functions.php file to do this

    function basel_favicon() {}

    Regards

    February 22, 2020 at 4:09 pm #175404

    oleg_dmitriev
    Participant

    The snippet does not save:

    The snippet has been deactivated due to an error on line 2:

    Cannot redeclare function basel_favicon.

    February 23, 2020 at 9:00 am #175489

    Artem Temos
    Keymaster

    Be sure that you add it to the child theme functions.php. Please, send us a screenshot of that.

    February 23, 2020 at 12:11 pm #175522

    oleg_dmitriev
    Participant

    Artem, hi,
    It worked. I posted the code directly into functions.php instead of a Snippet, and it saved fine. Thanks for your help!

    Yesterday I downloaded Google fonts I use and posted them as Custom fonts. This removed a few http requests. Today, I removed the favicon.png request and replaced it with binary.

    Now, I am at 1.0 – 1.2 seconds load time (GTMEtrix) and at 50/95 with Google speed checker
    https://ibb.co/NZSRcwN

    I work with a combo of Asset Optimiser + WP Rocket + SG Optimiser. As you see, my YSlow is 85% because I do not use a CDN (PageSpeed is 98%). I assume that by going for CDN I may gain a bit further.

    If you have any other optimisation suggestions please share 🙂

    Have a nice weekend, and thanks for the fast theme.

    February 24, 2020 at 7:02 am #175639

    Artem Temos
    Keymaster

    We are glad that you have such performance scores. Everything seems to be set correctly 🙂

  • Author
    Posts

Tagged: 

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