Post design
in Blog
url: http://www.meyouandtheworld.com/auf-weltreise/
first blog part: muffin builder / second part: VC custom grid
I would like to use Muffin Builder instead of VC, but I need some modifications for muffin elements:
1. How can I change post excerpt font-size?
2. Is it possible to change image size?
3. How can I change/delete animation effect for image? + How to do the same for the single post image?
4. Instead of this 'mehr'- link to post (post-footer) I would like to add a button (like VC-part). How can I do this?
5. How can I change the 'load more' - button to a default button? + How can I change color of this button?
Thank you in advance!!
first blog part: muffin builder / second part: VC custom grid
I would like to use Muffin Builder instead of VC, but I need some modifications for muffin elements:
1. How can I change post excerpt font-size?
2. Is it possible to change image size?
3. How can I change/delete animation effect for image? + How to do the same for the single post image?
4. Instead of this 'mehr'- link to post (post-footer) I would like to add a button (like VC-part). How can I do this?
5. How can I change the 'load more' - button to a default button? + How can I change color of this button?
Thank you in advance!!
Comments
1. Post excerpt font size can be changed with below css:
.post-excerpt { font-size: 12px !important; }2. For that you need to modify functions/theme-functions.php file where add_image_size() functions are.3. This hover effect can be removed with below css:
.image_frame .image_wrapper .mask::after { display: none !important; }4. For that you need to modify theme files because we do not have any option to do this..image_frame .image_wrapper img:not(.ls-l) { top: 0 !important; }
5. You can not change this button unfortunately. You can only change it's colors with below css:
.pager_load_more .button_icon { background: #000 !important; }.pager_load_more .button_icon i { color: #FFF !important; }
.pager_load_more .button_label { background: #000 !important; color: #FFF !important; }
4. which theme files?
1,2,3,5: Thank you!!
3. For that you must modify includes/content-post.php file. But please notice that we do not offer files customization so if you don't know what to do, we recommend to contact with your site developer.
after updating theme files, my featured images (at the beginning of all blog
posts) are smaller than before. Can you please tell me how to scale them to full-wide (desktop 784px)?
Example: http://www.meyouandtheworld.com/atacama/
Besides I recognized that the code to stop the hovering effect (from #3 above) leads to an invisible bottom part of the featured image. How can I show full-height ?
-> means how to show featured images in full-size 784x480?
Please click at the featured image and you will see that the image is set to 784x480. But it is not shown that way. (like other pictures in the post)
2. the css ".image_frame .image_wrapper img:not(.ls-l) { top: 0 !important; }" just stop the hovering effect and fix the picture at top. Means that the bottom part become invisible. Because hovering effect always needs parts of the picture not shown to show them by hovering. I never get complete 480px hight. Please open the picture seperately and compare them. You will see that bottom 5-15px are not shown.
How can I show full height 480px?
.section-post-header .single-photo-wrapper.image .image_frame { max-width: 100% !important; }2. Ok, we got it now. To remove 15px of bottom margin, you need to use the following css:.image_frame:not(.no_link) .image_wrapper img:not(.ls-l) { margin-bottom: 0 !important; }