Top pallet logo, title and menu

I stand corrected as per the URL for the logo and the title. Thank you.
However, a quirky problem has risen: if I make the Top Pallet Title visible in the desktop view, I get the URL literally showing up in the top pallet!

But, if I leave the Identity/site title blank, the URL displayed in the top pallet disappeared.
How can this be?

The indicated path to the logo…```.top-pallet-logo {
background-image: url(“https://pideja.ca/backlight/designer/page/images/6 1”);

Should be: “https://pideja.ca/backlight/data/designer/uploaded_images/6 1”`, if I read the path on the ftp server correctly. Alas, no change at all!

There’s a typo in your url path:

background-image: url("https://pideja.ca/backlight/designer/page/images/6");

It should be image not images.

This is why:
image

I checked the source code using W3C Markup Validation service for an error on that line. None found. In fact, it found many mistakes, mainly trailing slashes, but none concerned the typeface nor the top pallet.

This morning, reaching the web site, still no logo and the font is wrong.

image

For an image, that should be <img src="https://.....">.

You have some font related issues as well:

Failed to decode downloaded font: https://pideja.ca/backlight/custom/fonts/webfonts/JosefinSans-VariableFont_wght.woff2Understand this warning
(index):1 OTS parsing error: invalid sfntVersion: 1008821359
(index):1 Failed to decode downloaded font: https://pideja.ca/backlight/custom/fonts/webfonts/JosefinSans-Italic-VariableFont_wght.woff2
(index):1 OTS parsing error: invalid sfntVersion: 1008821359

I know about the html error but I don’t know to access that code other than doing some Backlight changes.

As for the font errors, I think I solved it using:

body {
  font-family: "Josefin Sans", sans-serif;
}

/* Police variable : Style normal (poids 100 à 900) */
@font-face {
  font-family: "Josefin Sans";
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: 100 900; 
  src: url("/backlight/custom/fonts/webfonts/JosefinSans-VariableFont_wght.ttf") format("woff2-variations");
  font-display: swap;
}

/* Police variable : Style italique (poids 100 à 900) */
@font-face {
  font-family: "Josefin Sans";
  font-optical-sizing: auto;
  font-style: italic;
  font-weight: 100 900; 
  src: url("/backlight/custom/fonts/webfonts/JosefinSans-Italic-VariableFont_wght.ttf") format("woff2-variations");
  font-display: swap;
}
It seems to display correctly on the site pages.

Reverting to the “original” php, this snippet got the logo back!

    function pallet_top_title()
    {
        echo '
        <li class="top-pallet-logo"><a href="https://pideja.ca/"></a></li>
       

  ';
        return false;
    }    
   

So, I’m half-way there. Or am I? All I need now is to find my nameplate…

This is what you’re after, aren’t you?

function pallet_top_title() {
   echo '
      <li style="margin-left: 50px;" class="top-pallet-logo"><a href="https://pideja.ca/"></a></li>
      <li style="margin-left: auto; margin-right: auto;" class="top-pallet-nameplate"><img src="/backlight/designer/page/image/31"></li>
   ';
   return false;
} 

Obviously, all the styles should be part of your css file. I just hacked the page in the editor to see if this works.

Hopefully, I didn’t make any typos copying and pasting the code…

1 Like

That did it! Thanks, Daniel I tried to simplify a bit…:

   function pallet_top_title() {
   echo '
     <li class="top-pallet-logo">
    <a href="https://pideja.ca/"><img src="path/to/logo.png" alt="Logo"></a>
</li>

   ';
   return false;
}    

Seems to work.

I wouldn’t do that. Your page still shows my code.

You are right, of course, With my track record in coding, I should be reluctant to “correct” suggestions by Rod or you.
I am now looking to align and reproportion the Top-pallet in the mobile format. Not easy (for me(.