Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • February 7, 2020 at 11:54 pm #235397
    joma5662
    Participant

    When viewing my site on desktop the front page looks exactly how I want. Then when I try to view it on a mobile or tablet the website doesn’t scale down, so my logo is being cut off. Is there something that I can do to fix this issue?

    February 8, 2020 at 6:57 am #235415
    SELLAR
    Participant

    Below is an option. create a resized image and set seperate image file at mobile size.
    Prob betters ways to do it but works for me at this stage.

    /* Phone Display Settings */

    @media     (max-width: 30em)
    {
    /* Header Image */
    .custom-header
    {
    background-image: url(http://3dbim.solutions/wp-content/uploads/2020/01/3DBS_Logo_300dpi.png) !important;
    }
    }

    February 9, 2020 at 12:47 am #235503
    tikaram
    Participant

    @sellar : First, I would like to recommend you to upload a smaller size logo rather than the big one. The recommended size for the logo is 100px * 100px and let me know. After changing the logo let me know if it still doesn’t scale on mobile devices. Let me know if you have any more issues.

    Regards,
    Tikaram

    February 9, 2020 at 9:06 pm #235544
    joma5662
    Participant

    I just overlaid my logo in photoshop within my header image. I just need the header image to be resized for mobile. Is there a way to do that?

    February 9, 2020 at 9:23 pm #235545
    joma5662
    Participant

    I tried that html but nothing really happened.

    http://www.Buddkerr.com

    February 9, 2020 at 11:47 pm #235556
    tikaram
    Participant

    @joma5662: The header image can be resized but it will have some space above and below the image which will not look good when viewing from mobile devices. Since the image is used as the background image its difficult to scale the image because the height is generated by the full page js. I think it would be better if you use text instead of having it within the image because the text will fit automatically and the middle part of image is still visible which would look better than the current image.

    Regards,
    Tikaram

    February 12, 2020 at 6:50 pm #235909
    joma5662
    Participant

    @tikaram I see, I tried that route at first but couldn’t figure out how to add text to the header image and make it large.

    February 13, 2020 at 2:46 am #235967
    tikaram
    Participant

    @joma5662: Login to your WordPress admin. Go to Appearance=> Customize => Header Media
    Scroll down until you find Header Media Title. Insert the desired title in the text field and the text will be displayed in the header. Click on publish to save your settings.

    Let me know if you have any more issues.

    Regards,
    Tikaram

    February 13, 2020 at 10:15 am #236007
    joma5662
    Participant

    @tikaram Yeah but the size is limited to size 36 font or so. I want the size to be around 90 font.

    February 14, 2020 at 12:04 am #236081
    tikaram
    Participant

    @joma5662: I checked your site but still you have the header image with the text within the image. Can you please change it as advised and then I can provide you the additional css.

    Regards,
    Tikaram

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘desktop to mobile’ is closed to new replies.