Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • December 1, 2014 at 12:22 am #360491
    grasshopperbee

    Hi,
    How can I add my own logo + the site title in the header? Similar to the logo in the header of the support forum here, but not having the site title disappear on shrink.
    Thanks.

    December 1, 2014 at 3:24 pm #360785
    Yigit

    Hey woeph!

    Please add following code to Functions.php file in Appearance > Editor and post the link to your website

    add_filter('avf_logo_subtext', 'kriesi_logo_addition');
function kriesi_logo_addition($sub) {
    $sub .= "Company Name";
    return $sub;
}

    Cheers!
    Yigit

    December 2, 2014 at 1:10 am #361213
    grasshopperbee
    This reply has been marked as private.
    December 2, 2014 at 6:13 am #361313
    Ismael

    Hey!

    Please add this on Quick CSS:

    #top .av_header_transparency.av_alternate_logo_active .logo a > img {opacity: 1; filter: alpha(opacity=100); }
strong.logo, .logo a { overflow: visible; }
span.subtext { position: absolute; left: 230px; top: 0; color: white; width: 100%; }

    Best regards,
    Ismael

    December 3, 2014 at 2:10 am #361903
    grasshopperbee

    Hey Ismael,

    Thanks for the code, it helped to an extent. I’d like to enable this to work with the shrinked header and it’s also messed up on mobile. For the record, I’m using an SVG logo and the full code is

    /* Adjustments for SVG logo */
.logo img {
width: 100%;
}

@media only screen and (max-width: 480px) {
.responsive .logo a, .responsive .logo img { max-width: 80%; }}

/* Logo + Text */
#top .av_header_transparency.av_alternate_logo_active .logo a > img {opacity: 1; filter: alpha(opacity=100); }
strong.logo, .logo a { overflow: visible; }
span.subtext { position: absolute; left: 230px; top: 0; color: white; width: 100%; }
    December 3, 2014 at 7:31 pm #362407
    Yigit

    Hi!

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 768px) {
span.subtext { left: 63%; }}

    Edit: I cannot see any issues when this is used with shrinking header. Have you figured it out already? If not, please post a screenshot of the issue

    Best regards,
    Yigit

    • This reply was modified 10 years, 5 months ago by Yigit.
    December 4, 2014 at 3:15 am #362658
    grasshopperbee

    Done some edits, it’s sorted now. Thanks guys!

    /* Adjustments for SVG logo */
.logo img {
height: 100%;
}

@media only screen and (max-width: 767px) {
.responsive .logo img {height: 100% !important;}}

/* Subtext */
#top .av_header_transparency.av_alternate_logo_active .logo a > img {opacity: 1; filter: alpha(opacity=100); }
strong.logo, .logo a { overflow: visible; }
span.subtext { position: absolute; left: 120%; top: 0; color: white; width: 100px; font-size: 16px; font-weight: 600; }

@media only screen and (max-width: 767px) {
span.subtext { left: 100px; }}
  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Custom Logo + Site title’ is closed to new replies.