13 {{ upvoteCount | shortNum }}
13 {{ upvoteCount | shortNum }}

How to put copy in "box" on wordpress?

by Edward W Smith
9 replies
Hi, I want to put part of the copy I post on a Wordpress blog in a "box", so it stand out from the rest of the copy in the post. I want to search how to do this, but I don't know how to define what I want to accomplish. Can anyone please tell me the name of what I am trying to create, and of course if you can tell me how to do it, even better. Thanks in advance for your help. Ed.
#box #copy #put #wordpress
  • Profile picture of the author RealCasher
    Easiest way is to simply put that content in a table and you can define an image for that table or a solid color as a background so it can standout

    Here's a code I made for you to try


    <table align="center" bgcolor="#FFFF00" border="0" cellpadding="0" cellspacing="1" style="width: 400px;">
    <tbody>
    <tr>
    <td>
    Your content here
    </td>
    </tr>
    </tbody>
    </table>
    Its a box of 400px with a yellow background.
    Signature
    Get Weekly Payouts Stream -Using- My Autopilot Money Machine


    Discover & Jump into the 2015's Hottest Income Opportunity -- (Viral Stuff.)
    {{ DiscussionBoard.errors[9919105].message }}
  • Profile picture of the author Chris Lee
    Why use a table when it's not necessary?

    They're a mess to deal with.

    Just use CSS.

    <div style="padding: 40px; border: 1px solid #eee; background:#f5f5f5;">
    PUT YOUR TEXT IN HERE
    </div>

    Cleaner to use classes but this works too. You can play around with the values.
    Signature
    Follow my journey to $10,000/month with Adsense.
    {{ DiscussionBoard.errors[9919137].message }}
    • Profile picture of the author Tim3
      Originally Posted by Chris Lee View Post

      Why use a table when it's not necessary?
      They're a mess to deal with.
      Just use CSS.
      <div style="padding: 40px; border: 1px solid #eee; background:#f5f5f5;">
      PUT YOUR TEXT IN HERE
      </div>
      Cleaner to use classes but this works too. You can play around with the values.
      This^^
      Chris has given you the best method Edward,
      Just to add, make sure you are in 'text' mode when you paste in the code not wysi
      Signature

      {{ DiscussionBoard.errors[9919306].message }}
  • Profile picture of the author Joe Lumbergh
    The one free WP plugin i would recommend to anybody ever asking me about good WP plugins is "Shortcodes Ultimate".

    Google it, watch a video about it. It has shortcodes for buttons, boxes, tables, counters, lists, spoilers, everything. and its very simple and beautiful coded and completely free..
    5 star rating average and for a reason. OP I think you would benefit from it.
    (not affiliated what so ever)
    Signature
    {{ DiscussionBoard.errors[9919166].message }}
  • Profile picture of the author Edward W Smith
    [DELETED]
    {{ DiscussionBoard.errors[9919204].message }}
    • Profile picture of the author Tom Addams
      Originally Posted by Edward W Smith View Post

      Thanks for all the input so far, it looks great and if anyone else has an opinion, please add your thoughts, thanks again to all, Ed.
      Hi Edward,

      I'd go with shortcodes. It's just my own preference, though. They're easy, clean, and a real time-saver for folks like us. It may also be that your WP theme even comes with the necessary shortcode for this. If you Google "theme name theme shortcodes" that may dredge up the information. I'm a big fan of this site, too: ThemeForest.net. I'm sure you know about it already, but if not you'll find plenty of themes with this capability, and if you click the "Code Canyon" button, you'll also find plugins for it. I'm not familiar with the plugin suggested above, but if it does the job for free, that's the one I'd grab.

      Tom
      Signature

      I Coach: Learn More | My Latest WF Thread: Dead Domains/ Passive Traffic
      Learn one way I earn money: I give away free stuff.

      {{ DiscussionBoard.errors[9919215].message }}
  • Profile picture of the author Chris19h
    Definitely don't use a table for this, that is so 2004. Use the div code Chris Lee gave you. Adding a plugin just for one box is not worth it!
    Signature
    Let's build a website you are excited to show off!
    {{ DiscussionBoard.errors[9919222].message }}
  • Profile picture of the author mrdeflation
    just seems easier to use a border with padding.. heck you can even add a background color or image easy that way to make the contents stand out even more
    Signature

    {{ DiscussionBoard.errors[9919312].message }}
  • Profile picture of the author Edward W Smith
    Hey these all look great, I am trying out the CSS code Chris Lee offered and I am having one issue and let me tell you I know zip about coding, but when I insert it as follows, I can get the copy below the "box" to move down a few spaces below the box, in order to better set it apart. I have tried editing it and updating it and of course have it posted in the text entry section. Any suggestions why I can't get the copy below the box to move down a few spaces in spite of it being entered a few lines below the code? Thanks, Ed.

    One Minute Motivator # 38
    <div style="padding: 40px; border: 1px solid #eee; background:#f5f5f5;">
    3% of the population have written goals, the rest of the population works for them.</div>
    If you really want to move your life ahead now, download a copy of my book <a title="&quot;Sixty Seconds To Success&quot;" href="http://www.amazon.com/Sixty-Seconds-Success-Edward-Smith-ebook/dp/B001QXDT9O/ref=sr_1_2?s=books&amp;ie=UTF8&amp;qid=1421700161& amp;sr=1-2&amp;keywords=sixty+second+to+success+kindle&amp; pebp=1421700169065&amp;peasin=B001QXDT9O">"Sixty Seconds To Success"</a>.

    Edward W. Smith
    Motivational Expert.
    Signature
    “Over 1,000 People Have Used My Unique Pitch System To Achieve Their Publicity Goals... And I’ll Work Personally With You Too, One-On-One To Help You Get On TV!” CLICK HERE
    {{ DiscussionBoard.errors[9920426].message }}
    • Profile picture of the author Tim3
      Originally Posted by Edward W Smith View Post

      I can get the copy below the "box" to move down a few spaces below the box, in order to better set it apart. I have tried editing it and updating it and of course have it posted in the
      I take it you mean you can't get a space Edward?

      After the closing </div> element and still while in in html mode, not wysi ,on a new line add the code
      &nbsp;
      add as many as you need but put each one on a new line.
      Signature

      {{ DiscussionBoard.errors[9922902].message }}

Trending Topics