9 {{ upvoteCount | shortNum }}
9 {{ upvoteCount | shortNum }}

HTML in Wordpress....some help, please!

by CatherineMay
7 replies
I've been working for a long time today (don't want to count the hours), on a one of my only two wordpress sites, and am going nuts with a bit of HTML code. I'm new at all of this, so maybe there's an easier way to accomplish what I'm wanting to do that I don't know about.

This site features items of jewelry from Amazon, and I'm writing descriptions with a clickable image to the right.

I don't want to use an Amazon plug-in on the first page, because I don't want the Amazon logo visible, and I want to do my own descriptions.

The idea is to have succeeding sections of two or three very brief paragraphs, each section featuring a specific item, with the clickable image to the right.

I'm using <p>&nbsp;</p> between the first section and the second one (I haven't gotten beyond this point) to create a sufficient break so it doesn't all run together.

The problem is this code keeps disappearing. Whenever I've gone back into edit to change some text or fiddle with an image, the code disappears from the html page, and messes up the appearance, and I have to go put it back in.

Obviously, there's something I should be doing that I don't know about...can somebody please tell me what it is?


Catherine
#html #wordpresssome
  • Profile picture of the author Istvan Horvath
    The keyword (that you are not aware of) is "float".

    Whenever you place an element (image or div or whatever to the right or to the left it's getting a class like "alignright" - and if you look up in your stylesheet, most likely there is something like:
    .alignright {
    float: right;
    etc.}

    That line tells the browser to 'push up' everything on the right until they fill up the space. BTW, if you don't know html and css then the above description doesn't say anything to you.

    THE SOLUTION.
    1. Dowbnload your theme's style.css file and open it in a simple text editor, like notepad.
    2. If you can, make a search for the words: both and clear.
    3. If you find one, e.g. something like:
    .clearer {clear: both;} - this is the class ("clearer") that we are going to use.
    4. To use means instead of your '<p>&nbsp;</p>' (which will be deleted by WP) add this:
    <br class="clearer" />
    You are good to go.
    5. If you don't find anything like that in your stylesheet, then add this at the end of it:
    .clearer {clear: both;}
    6. Now follow #4.

    HTH
    Signature

    {{ DiscussionBoard.errors[2190728].message }}
    • Profile picture of the author CatherineMay
      I just had to come back to the forum because just adding a "thanks" doesn't seem adequate.

      Istvan Horvath, I really appreciate your taking the time to give me such a detailed explanation of what to do. I actually learned something! And thanks to the other very useful replies.

      What an awesome forum!


      Catherine
      Signature

      {{ DiscussionBoard.errors[2191320].message }}
  • Profile picture of the author Mark Hess
    Try swapping out the standard Wordpress WYSIWYG editor with this one: Dean?s FCKEditor for WordPress - a WYSIWYG editor plugin : DEAN LEE:/DEV/BLOG

    It tends to hold the code much better... you shouldn't even have to use the <p>&nbsp;</p> code...
    Signature
    {{ DiscussionBoard.errors[2190792].message }}
  • Profile picture of the author bigg
    or dont use the wysiwyg editor and use the default html editing panel.
    option to turn this off is in the user page of wp-admin
    {{ DiscussionBoard.errors[2190897].message }}
    • Profile picture of the author Istvan Horvath
      Originally Posted by bigg View Post

      or dont use the wysiwyg editor and use the default html editing panel.
      option to turn this off is in the user page of wp-admin
      Oh, yes...

      I always forget to add to disable completely the wysiwyg animal, if you are messing with html. Just switching from visual to html will NOT disable it!

      (I usually forget about it because I never use it.)
      Signature

      {{ DiscussionBoard.errors[2191071].message }}
  • Profile picture of the author Chris Thompson
    Exactly - turn of wysiwyg. It is under user profile in the dashboard.
    {{ DiscussionBoard.errors[2191118].message }}
  • Profile picture of the author Abledragon
    Another way to beat the WordPress HTML filters is the Raw-HTML plugin. If you don't want to disable the Visual editor this will work as well - I reviewed it here:

    http://www.wealthydragon.com/blog/20...ordpress-html/

    Cheers,

    Martin.
    Signature
    WealthyDragon - Earning My Living Online
    {{ DiscussionBoard.errors[2191233].message }}

Trending Topics