Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • March 27, 2022 at 8:38 pm #1346232
    lauterkeit

    Hi Team
    I would like to align in the masonry – text above and everything in black
    date directly under the title.

    landing page masonry text on top

    thanks for the CSS

    Kind regards, Boni

    March 27, 2022 at 9:30 pm #1346239
    Mike

    Hey lauterkeit,
    Thank you for the link to your site and the screenshot, to move the date and make it black, try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

    function move_masonry_date() { ?>
    <script>
(function($){
  $( 'a.av-masonry-entry' ).each(function() {
  $( this ).find( '.av-masonry-date' ).css({ 'color': '#000'}).insertBefore( $(this).find('.av-masonry-entry-content'));
  });
})(jQuery);
</script>
    <?php
}
add_action('wp_footer', 'move_masonry_date');

    the expected results
    2022-03-27_011.jpg

    Best regards,
    Mike

    March 28, 2022 at 8:26 am #1346267
    lauterkeit

    Hi Mike,

    thank you that works.

    The other issue: how can all the text be aligned at the top, i.e. not in the middle?

    and a “read on” at the end.
    The whole text excerpt should also be visible.

    Thanks for feedback
    Boni

    March 28, 2022 at 11:09 am #1346280
    lauterkeit

    thanks for quick help

    The other issue: how can all the text be aligned at the top, i.e. not in the middle?

    and a “read on” at the end.
    The whole text excerpt should also be visible.

    Thanks for feedback
    Boni

    March 28, 2022 at 12:48 pm #1346288
    Mike

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

    #av-masonry-1 .av-masonry-entry .av-inner-masonry-content {
    padding: 2px 10px;
}
#top #av-masonry-1.av-fixed-size .av-masonry-entry.av-masonry-item-no-image .av-inner-masonry-content-pos, #top #av-masonry-1.av-caption-style-overlay .av-masonry-item-with-image .av-inner-masonry-content-pos {
    vertical-align: top;
}

    For the one that doesn’t show all of the text you will need to reduce the amount of text, it is too much for the space. If you are using the manual excerpt add your “read on” at the end.

    Best regards,
    Mike

    March 28, 2022 at 2:11 pm #1346309
    lauterkeit

    Thanks Mike,
    it works.

    Other Question: how do i change the font colour of the body text in the tile?
    not white, but black

    Thanks for feedback.
    Boni

    March 28, 2022 at 2:26 pm #1346311
    Mike

    Hi,
    Glad to hear, for black body text try this css:

    #top #av-masonry-1 .av-masonry-entry.isotope-item .entry-content {
    color: #000;
}

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.