How do I make my logo crisp?

Home › Forums › Jevelin Theme › How do I make my logo crisp?

Home › Forums › Jevelin Theme › How do I make my logo crisp?

Viewing 20 posts - 1 through 20 (of 20 total)
  • Author
    NOT RESOLVED Posts

  • shanticfm
    Participant

    Hi,

     

    How can I make my svg file logo that is 600px x 800px to 300px x 400px?

    Is that done throught the CSS?

     

    Shufflehound Support
    Moderator

    Hi @shanticfm,

     

    I hope you are well today and thank you for your question.

     

    We can try doing it developing custom CSS code.

     

    Could you please share me your site URL where it’s displaying so that i can help you to achieve it?

     

    Best regards,
    Shufflehound team

    shanticfm
    Participant

    Hi, thanks for your help!

     

    The site is coming along and can’t wait to get it launched!

    http://sweetme.creativeflowmedia.org/

     

    Attached is the logo svg file.

    shanticfm
    Participant

    I was able to upload the svg file to our site:

    http://sweetme.creativeflowmedia.org/sm-logo-web/

     

    I’d like the logo to have a max width of 300px

     

    Thanks!!!

    Shufflehound Support
    Moderator

    You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.

     

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

     

    .header-logo {
    max-width: 300px;
}

    shanticfm
    Participant

    Thanks, the size thing helped the original png logo that was in there. But now that I tried using the SVG file, the image won’t appear…

     

    Shufflehound Support
    Moderator

    You are passing SVG image file as a SRC of image tag as shown in the attached screenshot therefore the logo is not displaying.

    How are you setting SVG logo?

    Attachments:
    You must be logged in to view attached files.

    shanticfm
    Participant

    Well I found a site that said all I had to do was add this:

     

    function cc_mime_types( $mimes ){
    $mimes[‘svg’] = ‘image/svg+xml’;
    return $mimes;
    }
    add_filter( ‘upload_mimes’, ‘cc_mime_types’ );

     

    To the functions.php code so that I could upload that svg file through the editor. So I was able to upload it, then when I select it as an image from Theme Settings, it doesn’t appear on the front end of the website.

     

    Please advice?

    Shufflehound Support
    Moderator

    The above shared code just allows you to upload SVG images on your site but the theme currently doesn’t support SVG image as a logo so you have to develop more custom code to use it as a logo.

     

    Developing custom code for custom functionality is beyond the scope of support that we provide here. Please see https://themeforest.net/item/jevelin-multipurpose-premium-responsive-wordpress-theme/14728833/support

     

    If you are not a developer then you can consider hiring a developer to develop it for you. You can hire a developer from any freelance site. Shufflehound recommends the developer https://www.upwork.com/freelancers/~011652ffec8865c6d5

    shanticfm
    Participant

    Ok, so I decided to keep it png. But the header where the logo is has a lot of white space above it. On both header 1 (home page) and header 4 (all other pages).

     

    How can I minimize it?

     

    Shufflehound Support
    Moderator

    You can remove that white space by adding the following CSS code in the Custom CSS code option of your theme on the below path.

     

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

     

    #page-container .header-logo {
    margin: 0 auto;
    padding: 0;
}
#page-container .sh-header-top{
    padding: 0;
}

    shanticfm
    Participant

    Thanks for all your help! I hate to be so annoying… the space is indeed thinner but there is still too much space above the logo that makes the whole header not look centered.

     

    Please help.

     

    Shufflehound Support
    Moderator

    That thinner space is a part of your logo image http://sweetme.creativeflowmedia.org/wp-content/uploads/2017/06/SM-Logo-Web-01.png so you have to remove it from the logo image file.

    shanticfm
    Participant

    Thanks, but if you look again, the logo only has a smaller 5px of white space, which you can see is the area below the logo. But the area above the logo looks like it has 50px of white space, which is not the logo.

     

    Any idea why that is?

     

    shanticfm
    Participant

    I was referring to the header have 50px of white space as apposed to the logo which only has 5px of white space…. Hope that makes sence?!

     

    Shufflehound Support
    Moderator

    I don’t see 50px white apce above the logo as shown in the attached screenshot.

     

    Please advise.

    Attachments:
    You must be logged in to view attached files.

    shanticfm
    Participant

    That’s strange, this is how it look on my screen.

    Attachments:
    You must be logged in to view attached files.

    Shufflehound Support
    Moderator

    Try clearing your browser cache or using different browser.

    shanticfm
    Participant

    I SEE!!! lol

    Ok, can we add 10 px to top and bottom 😉 <3

    Shufflehound Support
    Moderator

    Ohh those are too much custom changes that you requested which took our much time.

    Actually developing custom code for custom functionality is beyond the scope of support that we provide here. Please see https://themeforest.net/item/jevelin-multipurpose-premium-responsive-wordpress-theme/14728833/support

     

    If you are not a developer then you can consider hiring a developer to develop it for you. You can hire a developer from any freelance site. Shufflehound recommends the developer https://www.upwork.com/freelancers/~011652ffec8865c6d5

  • Author
    Posts
Viewing 20 posts - 1 through 20 (of 20 total)