Problem with search site

Support
#1

hi there,

i managed to style the search site a little bit. but i ran into probems.

1: the pictures are very big. i tried to make them smaller but then they arenet centered anymore.
how can i have smaller picture and center them?

2: is it possible to make the product tilte has a fixed heigh? so th images are in the same line?

3: is it possible to remove the hove for the image? it should be clickable but not with the white hover and the icon in the middle.

4: the max width from 1200 px seems gone? it is full screen now? how can i change it back to max 1200px?

thanks in advance
cheers

#2

Hi Harald,

Thanks for writing in! Could you please try adding the following CSS rule into your X -> Theme Options -> CSS area and see if that helps.

.search-results .entry-title {
    min-height: 120px;
}
.search-results .entry-featured {
    max-width: 50%;
    margin: 0 auto;
}
.search-results .entry-featured a.entry-thumb:hover img {
    opacity: 1;
}
.search-results .entry-featured a.entry-thumb:hover::before {
    opacity: 0;
}

Could you please provide a screenshot of the 4th issue, so that we should be able to assist you accordingly.

Thanks!

#3

hi,

many thanks for your help. that worked. for point 4 i attached a link in secure note with the image.
the search site is now full screen but should be limited to 1200px as all sites.

there are 2 more points:
5. is it possible to flip the image and the title?: so that the image is above the entry title? (i attached also an image)
6. is it possible to make a border around the search (image attached)

many thanks

#4

Hi Harald,

To achieve that, you can add the code below in Theme Options > CSS

.search-results .x-container>.product .entry-wrap {
    border: 1px solid #000 !important;
    margin: 0 0 30px 0;
    padding-bottom: 50px;
    position: relative;
}
.search-results .x-container>.product .entry-wrap .entry-header {
    position: absolute;
    z-index: 999;
    width: 88%;
    bottom: 0;
    padding: 0 0 20px;
}

Hope this helps

#5

hi,

the border worked fine! thanks for that.
but the title is not under the image. it is in the image… is this possible to change in the php file? if so can you please tell me wich search.php i have to change?
is it the /pro/cornerstone/includes/shortcodes/search.php; /pro/cornerstone/includes/views/partials/search.php or /pro/cornerstone/includes/elements/classic/_alternate/search.php ?

and one more, the site is still fullscreen: it should be limited to 1200 px like all other sites. you can see it now better with the border, or you can look at the 4.full_screen_but_should_be_1200px.jpg postet above in secure note.

thanks in advance

#6

Hi Harald,

None of those files will change it.

Please the css code with this

.search-results .x-container.offset-bottom {
    max-width: 1200px;
}

.search-results .x-container>.product .entry-wrap {
    border: 1px solid #000 !important;
    margin: 0 0 30px 0;
}

After that, create file content.php in wp-content\themes\pro-child\framework\views\icon and copy the code below into that file.

<?php

// =============================================================================
// VIEWS/ICON/CONTENT.PHP
// -----------------------------------------------------------------------------
// Standard post output for Icon.
// =============================================================================

?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    <div class="entry-wrap">
        <?php x_icon_comment_number(); ?>
        <div class="x-container max width">
            <?php if(is_search()):?>
                <?php if ( has_post_thumbnail() ) : ?>
                    <div class="entry-featured">
                        <?php x_featured_image(); ?>
                    </div>
                <?php endif; ?>
                <?php x_get_view( 'icon', '_content', 'post-header' ); ?>
            <?php else: ?>        
                <?php x_get_view( 'icon', '_content', 'post-header' ); ?>
                <?php if ( has_post_thumbnail() ) : ?>
                    <div class="entry-featured">
                        <?php x_featured_image(); ?>
                    </div>
                <?php endif; ?>
            <?php endif; ?>
            <?php x_get_view( 'global', '_content' ); ?>
        </div>
    </div>
</article>

Hope that helps

#7

hi,

many thanks! now it looks really good!

awesome support!

cheers

#8

You’re welcome! :slight_smile:

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.