I wanted to post some codes to several posts and set out to find ways to include longer code snippets on WordPress posts. Here are the steps I took to enable scrolling area for code snippets:
1. Go to your WordPress theme editor and either enable external style.css if not already enabled. I use tiga theme and had to enable the external style sheet.
2. Add the following code snippet to the style.css of your current theme
div.scroll {
height: 200px;
width: 300px;
overflow: auto;
border: 1px solid #666;
background-color: #ccc;
padding: 8px;
}
3. Then create a new post and paste the following in HTML mode
<div>
<p>This is a scrolling are created with the CSS property overflow.</p>
<p>
<span style="color: red;">This is red color</span>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.</p>
<p>This is a normal paragraph.
<span style="font-weight: bold; font-size: 22px;">This is big bold text</span>
</p>
<p>This scrolling are can contain normal html like <a href="index.php">link</a></p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.</p>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.</p>
</div>�
This is a scrolling are created with the CSS property overflow.
This is red color
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.
This is a normal paragraph.
This is big bold text
This scrolling are can contain normal html like link
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh.
Reference:
I’ve been looking for this info for a long time, thanks for your work.
Being Inexperienced Im constantly discovering on-line for reports which will help me. Thank you
We like your post, the point in which your internet site is actually a tiny bit different makes it so helpful, I get fed up of viewing the same old monotonous recycled stuff almost all of the time.
Very effectively written information. It is going to be worthwhile to anyone who usess it, including myself. Sustain the nice work – for certain i’ll take a look at extra posts.
Waklnig in the presence of giants here. Cool thinking all around!
æ”»ã‚よã†ã«ã‚‚å‹æ‰‹ã«é€²ã‚“ã§ã‚Œã°ã‚„りよã†ãŒãªã„ã®ã€‚一応第三者機関ã®æ¤œæŸ»ãŒåŸºç¤Žå·¥äº‹ã§ï¼‘回入ã£ã¦ã‚‹ã¯ãšãªã®ã§ ãã‚Œã ã‘ãŒé ¼ã‚Šã®ã‚ˆã†ãª???
Thanks for the article