Tagged: 

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • May 4, 2016 at 9:42 am #627005
    themeforesttony

    I am putting a post slider element on a home page and I would like to see if I can add a custom css to get the following to occur:
    1. Have the Post Title and Read More link be on top (overlay) the thumbnail instead of below it.
    2. Add a color overlay to the post’s thumbnail on the slider.
    Thanks.

    May 5, 2016 at 6:30 am #627626
    Rikard

    Hey themeforesttony,

    I’m not sure if that would be possible but send us a link to the page in question and we’ll have a look at it.

    Best regards,
    Rikard

    May 5, 2016 at 8:26 am #627681
    themeforesttony

    So here is how it currently looks:
    Post Slide Thumb Currently
    Here is what I am hoping to do:
    Post Slider Thumb Desired
    The idea to move the Title and read more onto the thumb and to add an overlay to whatevery the feautred image is or if no featured image, just to show the overlay.
    Dev URL is below.

    Thanks

    May 9, 2016 at 2:55 am #628956
    Ismael

    Hi,

    Thank you for the screenshots.

    Please add this in the functions.php file:

    // slide link
add_action('wp_footer', 'ava_new_custom_script');
function ava_new_custom_script(){
?>
<script type="text/javascript">
(function($) {
    function b() {
		$('.slide-entry').each(function() {
			var content = $(this).find('.slide-content').detach();
			$(this).find('.slide-image').append(content);
		});	
	}
   
   	b();
})(jQuery);

</script>
<?php
}

    And the following code in the Quick CSS field:

    .slide-content {
    opacity: 0;
}

.slide-entry:hover .slide-content {
    opacity: 1;
}

    Best regards,
    Ismael

    May 9, 2016 at 8:25 am #629071
    themeforesttony

    Wow. Would never have gotten that on my own.
    Thanks.
    Currently the title now appears when I mouseover.
    How do I get it to be there in normal state?

    May 9, 2016 at 9:34 pm #629485
    themeforesttony

    Ok I see how to make it static. Just need to get a default overlay instead of the icon. I will work on it but any clues are appreciated.

    May 10, 2016 at 1:41 pm #629897
    Yigit

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    
.fallback-post-type-icon {
    display: none!important;
}

    Best regards,
    Yigit

    May 14, 2016 at 8:01 am #632285
    themeforesttony

    Yigit,
    I’m sorry but I noticed that the additional functions.php code has caused the color section that was above the post sliders and below the top full width slider to move below the footer.
    Any thoughts as to why?

    May 17, 2016 at 4:20 am #633431
    Ismael

    Hi,

    My bad. There’s an extra line in the script. Please remove the following:

    $('#av_section_2').appendTo('#main');

    Best regards,
    Ismael

    May 17, 2016 at 7:39 am #633519
    themeforesttony

    I did and everything seems to be working on both issues.
    You mean you don’t remember every support ticket you handle? You’re actually human like the rest of us?
    Again thanks Ismeal for this time and all the others you have been of service. I am very grateful.

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Move Post Slider Text Content Into Thumbnail’ is closed to new replies.