WordPress.org

1. kushalkoolwal
   Member
   Posted 1 year ago #

   Hi,

   Many blogs are able to generate a rectangular box around the text. The text is usually a command or a sample code - so that it stands out. For example, this website has a box around the text - "cd /tmp" and so on.

   Is there any plugin in wordpress that will let me generate a similar box on my WP blog? If not is there any in-built HTML tag that I can use?

   Thanks

2. kushalkoolwal
   Member
   Posted 1 year ago #

   Any one???

3. ikirudesign
   Member
   Posted 1 year ago #

   Usually aesthetics are managed with themes. In the case of the site you link to, they've wrapped that text in <code></code> and then styled the code attribute.

   The easiest way to get something like that would be to add
   

   code {
     border: 1px dashed black;
   }

   to the style.css file of the theme you're using. Then where you want that border, do something like this:

   <code>Code goes here.</code>

   There's much more you can do with CSS, but that should get you started.

4. jdembowski
   Member
   Posted 1 year ago #

   Any one???

   Sheesh, it's only been 15 hours :)

   I personally like this one: WP-Syntax. It let's you surround your code with

   <pre lang="text">
   Useful code here
   </pre>

   If you drop a wp-syntax.css in your theme's directory, you can easily use CSS to style the box.

   You will have to add the tags via the HTML section of the editor.

5. AbeOnTech
   Member
   Posted 1 year ago #

   I have tried WP-Syntax, but it doesn't work for me.

   The codebox is about 15px high and blank :(

Topic Closed

This topic has been closed to new replies.