[Resolved] Search field size and Read more button

Home Forums Support Search field size and Read more button

This topic contains 7 replies, has 2 voices, and was last updated by  Leo 1 week ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1164654

    Maged

    Hi, I am using the Marketer demo from the site library and I need to do couple of things please.

    1- shrink the area of the search field to be displayed at the end of the navbar not the whole header to the logo.

    Search field

    2- How can I add a line break <br> before the Read more link, like in woorkup.com, or how can I add/delete/edit any html tag in general?

    Line break before Read more link

    Thank you.

    #1164723

    Leo Customer Support

    Hi there,

    1. Try this CSS:

    @media (min-width: 769px) {
        .navigation-search input {
            width: 50%;
        }
    }

    2. Try this CSS:

    a.read-more {
        display: block;
        text-align: right;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    #1165477

    Maged

    Thanks for your reply, regarding the search it works fine on desktop but on mobile phone the search input is very small, like it fits almost 3 or 4 characters only! It would be great if we can target the navbar area, so it expands to fit the whole navbar area using 100% width like in woorkup.com

    Also the read more button, I succeeded in adding <br> in the php code in here https://docs.generatepress.com/article/activating-read-custom-excerpt/
    but it works only for the Read more with custom excerpt not the regular one, so if there any way to inject the <br> tag before the read more button using code snippets or hooks, it would be appreciated. Thanks.

    #1165492

    Leo Customer Support

    Adjusted the code above so it’s desktop only.

    My CSS should work like adding a <br> tag no? We can tweak some more if you need to change the appearance more.

    #1165525

    Maged

    Perfect, adding the media query fixed the search field problem on mobile devices.

    Regarding the Read more I can add margin-top: 10px for example or any other css code, but I don’t know how to add/delete/edit an html tag like <br> for example before the Read more button, it would be appreciated if you let me know or give me a hint on how to achieve this. Thank you.

    #1165647

    Leo Customer Support
    #1165706

    Maged

    Great, I think I’ll stick with the CSS solution for now.
    I’m really happy I bought the premium version of GeneratePress.
    Thank you for your help.

    #1165760

    Leo Customer Support
Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.