Announcement

Collapse
No announcement yet.

How to Fix Layout of Search Module containing URL Preview posts on Narrow Sidebar

Collapse
This is a sticky topic.
X
X
Collapse
First Prev Next Last
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Free Mod How to Fix Layout of Search Module containing URL Preview posts on Narrow Sidebar

    When a post with URL Previews appears in a Search Module (e.g. Latest Topics) located in a narrow sidebar/column, the linked site preview information is excessively cut off due to limited space.

    Fix it as shown in the screenshot below with a simple set of CSS code.

    Click image for larger version

Name:	image.png
Views:	1546
Size:	136.4 KB
ID:	26026

    Add the below code in css_additional template:

    Code:
    .canvas-widget-list.l-narrow-column .b-post-sm .b-bbcode__url--preview {
        --thumb-size: 30px;
        padding: 10px;
    }
    .canvas-widget-list.l-narrow-column .b-post-sm .b-bbcode__url--preview .urlimg_container {
        margin-right: 10px;
    }
    .canvas-widget-list.l-narrow-column .b-post-sm .b-bbcode__url--preview .urlinfo {
        font-size: 95%;
    }
    .canvas-widget-list.l-narrow-column .b-post-sm .b-bbcode__url--preview .urlinfo .meta {
        margin-bottom: 0;
    }​

    The above code reduces the thumbnail size from the default of 90px to 30px. Adjust it according to your preferences.

    This code only applies to posts in a module that appears in a narrow sidebar/column. If the module appears in the wider column, the default style is used.

    If you widen the sidebar, you'll get even more space available for the URL Previews.

    Enjoy!

    Helpful? Donate. Thanks!
    Buy me a coffeePayPal QR Code
    Fast VPS Host for vBulletin:
    A2 Hosting & IONOS

Users Viewing This Page

Collapse

There is 1 user viewing this forum topic.

  • Guest Guest

Latest Posts

Collapse

Working...
X
Searching...Please wait.
An unexpected error was returned: 'Your submission could not be processed because you have logged in since the previous page was loaded.

Please push the back button and reload the previous window.'
An unexpected error was returned: 'Your submission could not be processed because the token has expired.

Please push the back button and reload the previous window.'
An internal error has occurred and the module cannot be displayed.
There are no results that meet this criteria.
Search Result for "|||"