Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #1158371

    Hello Enfold Support,

    I was wondering if you could provide some custom CSS to change the font size of the Title and Excerpt on just the Search Results Page. At the moment, the title size is too big while the excerpt size is too small. Again, this is just for the search results page.

    I tried searching if this was previously resolved, but I was unable to find anything.

    Thank you.

    #1158451

    Hey acelam714,

    Please try the following in Quick CSS under Enfold->General Styling:

    .search-results h2.entry-title a {
        font-size: 22px;
    }
    
    .search-results .entry-content p {
        font-size: 16px;
    }

    Best regards,
    Rikard

    #1158568

    Thank you very much! That worked perfectly.

    Is there a way that I can move the excerpt closer to the title? I had previously used the code below to hide the meta information, but there is just a huge gap between the title and the excerpt where the meta-information (date, comment) used to be.

    .search-results .post-meta-infos {
    display: none !important;
    }

    And is there a way for me to manually adjust the image so that I can have it be a larger size? It’s slightly small and I’d like to be able to adjust it as necessary. That’s all the questions I have left.

    Thank you.

    #1158743

    Hi,

    Please try this to move the title closer to the excerpt:

    .search-results h2.entry-title {
        padding: 0;
    }

    You can adjust the image with this CSS:

    .search-result-counter {
        height: 50px;
        width: 50px;
    }

    It’s positioned absolutely so if you want it bigger then you have to move the text content to the right.

    Best regards,
    Rikard

    #1159377

    The padding code below did not work for me. I’ve tried changing the numbers around as well.

    .search-results h2.entry-title {
    padding: 0;
    }

    How would I move the text content to the right?

    Thank you.

    #1159515

    Hi,
    Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

    @media only screen and (min-width: 768px) { 
    #top.search-results h2.entry-title {
        padding: 0 !important; 
    }
    #top.search-results .search-result-counter {
        height: 150px !important; 
        width: 150px !important; 
    }
    #top.search-results article.post-entry {
        margin: 20px 0 !important;
        height: 150px !important; 
    }
    #top.search-results .entry-content-header,#top.search-results .entry-content {
    	margin-left: 120px !important; 
    }
    }

    Please see the screenshot in Private Content area of the expected results.

    Best regards,
    Mike

    #1159622

    Thank you, Mike! You’ve saved the day again. I really do appreciate it.

    Can you clarify this line of code for me? That should be it. Thank you again.

    @media only screen and (min-width: 768px) {
    #top.search-results h2.entry-title {
    padding: 0 !important;
    }

    #1159640

    Hi,
    I started with the css @Rikard posted and then moved forward, perhaps this is no longer needed? Try removing it.

    #top.search-results h2.entry-title {
    padding: 0 !important;
    }

    But you do need this:
    @media only screen and (min-width: 768px) {
    otherwise the page is a mess on mobile, in my opinion.

    Best regards,
    Mike

    #1159729

    Everything works great, Mike. Thank you for everything!

    #1159784

    Hi,
    Glad we were able to help, we will close this now. Thank you for using Enfold.

    For your information, you can take a look at Enfold documentation here
    For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)

    Best regards,
    Mike

Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Changing the Title and Excerpt Font Sizes on Search Results Page’ is closed to new replies.