Replacing logo with text using functions.php - Support | Kriesi.at

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

Author

Posts
December 12, 2022 at 5:54 pm #1375978

GWS
Participant

Hi,
We are trying to replace the logo with the company name instead. We tried using the instructions in the documentation: https://kriesi.at/documentation/enfold/logo/ and also from this 2018 support topic: https://kriesi.at/support/topic/replacing-logo-with-text-and-then-control-font-size-and-add-tagline/ but both caused critical errors on the site. It is the only code we had placed in /child-theme/functions.php.

Can you confirm if the instructions in documentation are up-to-date, or provide new details for doing this. Please see the private content for the website URL. There is currently a ‘logo’ of the company name but it is not good quality, which is why we want to use the text instead. Thanks.

December 13, 2022 at 7:28 am #1376023
Ismael
Moderator
Hey GWS,

Thank you for the inquiry.

Did you add the following code in the functions.php file?
```
//-------------------------------
// function - Text Logos
//-------------------------------
add_filter('avf_logo_final_output', 'avf_text_logo_final_output');

function avf_text_logo_final_output($logo) {
  $link     = apply_filters('avf_logo_link', home_url('/'));
  $logotext = "LOGO TEXT";
  $subtext  = "A CUSTOM SUBTEXT";
  $subtext  = "<span class='subtext'>$subtext</span>";
  $logo     = "<span class='logo'><h1><a href='".$link."'>".$logotext.$subtext."</a></h1></span>";

  return $logo;
}
```
You can add this code in the Quick CSS field to adjust the style of the text logo and subtext.
```
/* Text logo styling */

#top .logo,
#top .logo a {  
  overflow: visible;
}

#top .logo {  
  background: gold;
    display: flex;
    align-items: center;
    padding: 15px;
}
#top .logo .subtext {
    font-size: 18px;
    color: #be0027;    
    position: absolute;
    width: 100%;
    left: 0;
    top: 25px;
}

/* Hide subtext on scroll */
#header.header-scrolled-full .subtext {
  display: none;
}
```
Best regards,
Ismael
December 13, 2022 at 4:15 pm #1376062

GWS
Participant

Thank you for this information. That helps a lot. Just a couple of questions:

1. Can you recommend the best way to add — before and after the subtext? In other words, “– Subtext –“, but with mdashes instead of hyphens. When I add mdashes to the functions.php it doesn’t do anything. A screenshot of the graphic logo is in private content to show you what I mean.

2. What can be done to move the text of the logo over to the left so it is more in line with the page titles of the website, without resorting to a negative left margin setting (see link in private content).

We appreciate your help as always!

December 15, 2022 at 7:50 pm #1376293

Mike
Moderator

Hi,
To add dashes befor and after your subtext try changing this line in your code:
$subtext = "<span class='subtext'>$subtext</span>";
to this:
$subtext = "<span class='subtext'>-" + $subtext + "-</span>";

Best regards,
Mike

December 15, 2022 at 9:43 pm #1376303

GWS
Participant

Thanks, but that caused a critical error on the site. Let’s just skip this. I will tell my client this is the best we can do and if she wants more on the logo she can hire a graphic designer. ;)
Thank you for your time.

December 16, 2022 at 1:14 pm #1376401

Mike
Moderator

Hi,
Ok, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike
Author

Posts

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

The topic ‘Replacing logo with text using functions.php’ is closed to new replies.