dbirlew

<p>Like the “Story Highlights” lists on articles at CNN.com and other sites, this adds a bullet list to each post’s content via an edit post page panel. The plugin sets up the code only, styling can be handled by adding the classes provided under the Other Notes to style.css in your theme.</p>
<h3>Use</h3>
<p>Add a new post or edit an existing post. A new panel titled “Story Highlights” appears in the right column of the edit post page. If these fields are all blank, the plugin does nothing. To add a “Story Highlights” bullet list to your post, you MUST add a list title and the first bullet point. Otherwise an empty list appears. You may add up to five bullet points, summarizing your post. To delete a bullet point, clear the field. UPDATE your post to save your bullet points.</p>
<h3>Alignment</h3>
<p>Below the list fields is the option “choose alignment”. By default it is set to “none” which inserts the element as a block above the post. Leave this option if you wish to manually apply your own floats to the element. Otherwise choose “left” or “right” to float the element to the right or the left of the first paragraph of your post. Note that floating the list left or right may break your layout if you insert an image at the start of your post.</p>
<h3>Styling</h3>
<p>This plugin inserts a (mostly) un-styled element above the first paragraph of your post content. The following unique classes and ids can be added to your stylesheet and used to position and style the element, allowing the freedom to style each part individually:</p>
<pre><code>div.shsp
h1.shsp_title
ul#shsp_ul
li.shsp_li1
li.shsp_li2
li.shsp_li3
li.shsp_li4
li.shsp_li5
</code></pre>
<p>As of version 1.4 checking the box labelled “Use default plugin styles?” will add styles to your source code. This can be enabled/disabled on a per-post basis. However, the recommended method of use is to add the classes above to the style.css file of your theme and style the Story Highlights box your own way, to match your look.</p>
<h3>Widget</h3>
<p>This plugin adds the Story Highlights widget to the Appearance > Widgets page. Add this widget to the sidebar that will be displayed on single post pages. This widget has no settings. If the widget is active then the post element is not inserted, and the list appears in the sidebar. Remove the widget from the sidebar if you wish to display the element within the post body.</p>


Story Highlights

Adds a bullet list to the start of the post content.

Lester Chan

<p>By default the content is hidden and user will have to click on the “Show Content” link to toggle it. Similar to what Engadget is doing for their press releases. Example usage: <code>[showhide type="pressrelease"]Press Release goes in here.[/showhide]</code></p>
<h3>Usage</h3>
<ol>
<li>By default, content within the showhide shortcode will be hidden.</li>
<li>Example: <code>[showhide]Press release content goes in here.[/showhide]</code></li>
<li>
<p>Default Values: <code>[showhide type="pressrelease" more_text="Show Press Release (%s More Words)" less_text="Hide Press Release (%s Less Words)" hidden="yes"]</code></p>
</li>
<li>
<p>You can have multiple showhide content within a post or a page, just by having a new type.</p>
</li>
<li>
<p>Example: <code>[showhide type="links" more_text="Show Links (%s More Words)" less_text="Hide Links (%s Less Words)"]Links will go in here.[/showhide]</code></p>
</li>
<li>
<p>If you want to set the default visibility to display.</p>
</li>
<li>
<p>Example: <code>[showhide hidden="no"]Press release content goes in here.[/showhide]</code></p>
</li>
<li>
<p>You can style the content via CSS that is generated by the plugin. Here is a sample of the generated HTML. Note that pressrelease is the default type.</p>
</li>
</ol>
<pre><code><div id="pressrelease-link-1" class="sh-link pressrelease-link sh-hide">  
  <a href="#">  
    <span id="pressrelease-toggle-1">Show Press Release (4 More Words)</span>  
  </a>  
</div>  
<div id="pressrelease-content-1" class="sh-content pressrelease-content sh-hide" style="display: none;">Content</div>
</code></pre>
<ol>
<li>With the example above, here are the following styles you can use in your CSS:</li>
</ol>
<pre><code>.sh-link A { }  
.sh-content { }  
.pressrelease-link { }  
.pressrelease-link.sh-hide A { }  
.pressrelease-link.sh-show A { }  
.pressrelease-content { }  
.pressrelease-content.sh-hide { }  
.pressrelease-content.sh-show { }
</code></pre>
<h3>Development</h3>
<p><a href="https://github.com/lesterchan/wp-showhide" title="https://github.com/lesterchan/wp-showhide" rel="nofollow ugc">https://github.com/lesterchan/wp-showhide</a></p>
<h3>Translations</h3>
<p><a href="http://dev.wp-plugins.org/browser/wp-showhide/i18n/" title="http://dev.wp-plugins.org/browser/wp-showhide/i18n/" rel="nofollow ugc">http://dev.wp-plugins.org/browser/wp-showhide/i18n/</a></p>
<h3>Credits</h3>
<ul>
<li>Plugin icon by <a href="http://www.freepik.com" rel="nofollow ugc">Freepik</a> from <a href="http://www.flaticon.com" rel="nofollow ugc">Flaticon</a></li>
</ul>
<h3>Donations</h3>
<p>I spent most of my free time creating, updating, maintaining and supporting these plugins, if you really love my plugins and could spare me a couple of bucks, I will really appreciate it. If not feel free to use it without any obligations.</p>


WP-ShowHide


Shows and hides text just like it says it does! Thank you!


Works great with WP 6.8.1

Allows you to embed content within your blog post via WordPress ShortCode API and toggling the visibility of the content via a link.

Story Highlights vs WP-ShowHide