Community Forums › Forums › Archived Forums › Design Tips and Tricks › Metro Pro / Simple Drop Cap Plugin
- This topic has 6 replies, 3 voices, and was last updated 8 years, 4 months ago by
Wayfinder.
-
AuthorPosts
-
October 12, 2016 at 4:08 pm #194607
Wayfinder
MemberThis plugin works great on pages and posts, but not on the homepage which uses the Genesis Featured Posts widget. When looking at the source of the rendered home page I see that the span and associated "drop cap" text is gone (see snippets below). Any thoughts on how I (relative novice) might be able to extend the featured post widget would be greatly apprecaited!
Thanks
--MichaelWorking code on pages and posts
<p><span class="wpsdc-drop-cap">My</span> sample post text...Span (and associated post text) stripped from home page Genesis Featured Post widget
<div class="entry-content"><p>sample post text...NOTE: The associated site where this is occurring is currently in stealth mode
October 12, 2016 at 8:02 pm #194614carasmo
ParticipantYou'll have to ask the plugin developer or see if something similar has been asked before on the plugin's support forum. What this plugin is doing is looking for single posts and pages, it doesn't say that it works in an archive (which is what the featured-content is for the most part).
I don't bother with a plugin, you can use CSS for this and I just tested this with the featured content widget.
The first property in the media query is for all pages and posts and any content displayed with the class .entry (which is pages, posts, and the featured-content widget). The second property is over-writing the first to make the drop cap smaller on featured post content. If your featured content is inside a sidebar, it will be affected too, so you would use more CSS specificity to avoid it, such as
.content .entry p:first-child:first-letter
Under 700px this drop cap goes away. Unless you make another set BEFORE this with different values to make it smaller for the smaller device widths.
@media (min-width: 700px) { .entry p:first-child:first-letter { float: left; font-size: 68px; line-height: 48px; padding-top: 8px; padding-right: 8px; padding-left: 0; margin-left: -2px; font-weight: bold; } .featured-content .entry p:first-child:first-letter { font-size: 42px; line-height: 28px; padding-top: 5px; } }
October 12, 2016 at 8:54 pm #194619Wayfinder
MemberVery generous - Thanks! Looking forward to giving this a try.
Best,
--MichaelP.S. I did hear from the plugin developer and the behavior is "as designed" to avoid conflicts with various themes. There is apparently a "pro" version available, but I can't bring myself to pay an annual subscription for this kind of functionality - your code reaffirms that decision.
October 13, 2016 at 8:36 am #194646carasmo
ParticipantIn the beginning of a site, I think it's better to add it manually so you can control where it appears and where it doesn't appear without having to use CSS to not show on one page but show on another, etc. Here's mine for a paragraph class called .intro. It works on single pages and posts and not on archives with full content due to the body classes before it. This is an example only. Use the CSS from the initial reply to start with. I also noticed that the intro paragraph needs to be at least 2 lines at any given viewport width to make a drop cap look good, so that is why I went with manual.
<p class="intro">Words</p>
@media (min-width: 700px) { body.single p.intro, body.page p.intro { font-size: 19px; line-height: 1.7; } body.single p.intro:first-letter, body.page p.intro:first-letter { float: left; font-size: 68px; line-height: 48px; padding-top: 8px; padding-right: 8px; padding-left: 0; margin-left: -2px; font-weight: bold; } }
October 13, 2016 at 2:17 pm #194682Wayfinder
MemberI agree completely - I would much rather have finer control. Again, I really appreciate your assistance. Very thoughtful.
Best,
--MichaelOctober 13, 2016 at 3:20 pm #194685Victor Font
ModeratorWhen you display excerpts or impose content limits on the home page, WordPress automatically strips out HTML markup. This is not the featured posts plugin doing it, it is WordPress. You have to add code to functions PHP to tell WordPress to leave the HTML tags in. http://wpsites.net/wordpress-tips/add-back-html-tags-stripped-from-content-limit-excerpts-in-wordpress/
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?October 13, 2016 at 5:32 pm #194693Wayfinder
MemberFascinating! Thanks for the education and the code link!
Best,
--Michael -
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.