I was finally able to do what you are talking about.
Step 1: Create a class in your theme’s style.css called whatever, I used “inlineshow”, and set the display to inline:
CSS
.inlineshow {
display:inline;}
Step 2: For each section of your text you are going to use the show_more code in, wrap the text that precedes the hidden text with <p class=”inlineshow”> ……..</p>
<p class=”inlineshow”><span style=”color: #0b3350;”>This the content that will be shown </p>[show_more more=”show more” less=”show less” color=”#0066CC” list=”?”] This is the content that will initially be hidden [/show_more]
Step 3: Find the CSS for the plugin at plugins/wp-show-more/wpsm-style.css
Replace the CSS with this:
.wpsm-show a, .wpsm-show:active, .wpsm-show:visited {
cursor: pointer;
text-decoration: none;
}
.wpsm-show:hover {
cursor: pointer;
text-decoration: underline;
}
.wpsm-hide a, .wpsm-hide:active, .wpsm-hide:visited {
cursor: pointer;
text-decoration: none;
}
.wpsm-hide:hover {
cursor: pointer;
text-decoration: underline;
}
.wpsm-content-hide {
display: none !important;
}
.show_more {
display:inline !important;}
.wpsm-content {
display:inline;
/* If you want to style the text that appears after clicking on the Show More link, you can do it here */
color: #555;
font-size: 16px;
font-weight: 400;
line-height: 1.66em;
margin-bottom: 20px;
font-family: ‘Open Sans’;}
I hope I have not forgotten anything. Let me know. It works perfectly for me.
-
This reply was modified 8 years, 3 months ago by
JoeSHmow123.