Fast navigation: Wordpress Themes     Blogger Templates     Joomla Templates     HTML Templates     CSS Templates     Flash Templates     Phpnuke Themes     Php-fusion Themes    


Home Contact us Add to Favorites
  • Advertise At Template4all.com


    Subscribe To Our Feeds

    Template4all.com Web Templates

    Enter your email address:

    Delivered by FeedBurner










  • Reply
     Useful Codes for text widgets On Wordpress Blogs, Litlle tips !
    Wpress
    18 March 2010 11:05
    Message #1


    Newbie
    • 17

    Reputation: - 0 +
    Group: Member
    Posts: 8
    Registration: 8.05.2010
    ICQ:--
    Here is Some Useful Codes for text widgets On Wordpress Blogs :

    Text links
    The plain code for a link to any webpage is this:

    <a href="URL_HERE">TEXT_HERE</a>


    In most cases it’s better to use this:

    <a href="URL_HERE" target="_blank">TEXT_HERE</a>


    This way the link opens in a new browser window or tab, so that visitors don’t really leave your blog when clicking on a link.

    E-mail link:

    <a href="mailto:YOUR_EMAIL_ADDRESS_HERE">TEXT_HERE</a>


    To avoid spam, it’s usually wiser not to disclose your e-mail address. You can use the WP contact form instead (but in a page, not a text widget) – see here. Or you can display your e-mail, but in a way that will elude spam robots – see here plus here.

    Lists
    The content of several widgets (e.g. Categories, Links or Recent Posts) is unordered lists. The design of each theme presents unordered lists in its own way. If you want a list of items in a text widget to show up the same way, you use the code for unordered lists:

    <ul>
    <li>ITEM_ONE_HERE</li>
    <li>ITEM_TWO_HERE</li>
    [etc.]
    </ul>


    The code for nested lists (with indented sub-items) is like that:

    <ul>

    <li>
    ITEM_ONE_HERE
    <ul><li>
    SUB1_HERE
    </li><li>
    SUB2_HERE
    </li><li>
    SUB3_HERE
    </li></ul>
    </li>

    <li>
    ITEM_TWO_HERE
    <ul><li>
    SUB4_HERE
    </li><li>
    SUB5_HERE
    </li><li>
    SUB6_HERE
    </li></ul>
    </li>

    </ul>

    This is an example with only two main items and three sub-items to each, but it’s enough for demonstrating the structure of the code.
    Items and sub-items can be plain words or phrases, or any kind of allowed html code (e.g. links and/or style formatting).
    Text widgets with unordered lists can also be used instead of some of the other widgets (such as the links widget or the categories widget). This can be useful if you don’t like the default appearance of those widgets and want to change it using formatting for style, or if you want your links or your categories in a non-alphabetical order; or if you want to include images. The drawback, of course, is that each time you add a new link or category you’ll have to update the text widget manually.

    Scrollbox
    If you want to limit the length a text widget occupies in the sidebar, you can have its content in a (vertical) scroll box:

    <div style="height:150px;white-space:pre-wrap;overflow:auto;padding
    :8px;">
    CONTENT_HERE
    </div>


    The height number is just a suggestion – you can change it (but there’s a downward limit: below 45px there’s no room for the scrollbar). “Padding” is the space between borders and text – you can change that too. If you write an unordered list in a scrollbox, omit the padding altogether: the design of the theme will take care of that.

    Or you may need a horizontal scrollbox:

    <div style="white-space:pre;overflow:auto;padding:8px;">
    CONTENT_HERE
    </div>


    In some themes it will look better if you create a visible border around the box; in that case add this right after the opening quotation mark:

    border:solid 1px #999;


    Images
    The code for a plain image is this:

    <img src="URL_OF_IMAGE_HERE"></a>


    For an image that links to a webpage:

    <a href="URL_OF_WEBPAGE_HERE" target="_blank"><img src="URL_OF_IMAGE_HERE"></a>


    Of course the image has to be narrow enough to fit in the sidebar (in most themes, sidebars are around 150 to 200 pixels wide). If you’ve got a wider image, you can downsize it to fit – example:

    <a href="URL_OF_WEBPAGE_HERE" target="_blank"><img src="URL_OF_IMAGE_HERE" width="150" /></a>


    But it’s better to use properly sized images.
    Also note that it’s better to use images uploaded in your own blog. If you use the URL of an image hosted in another site, you get the delay of that site loading as well (plus you run the risk of losing the image if it gets relocated or removed).
    In some browsers you get a (blue) border around images. If you don’t want that, add this after “img” (with a space inbetween):

    border="0"


    If you want a simple thin border around the image, you can add this after “img” (with a space before and a spacer after):

    style="border:1px solid #HEX_NUMBER_HERE;"


    Hope this Can Be Helpful.
    Back to top


    | More
     
    « · Wordpress Tips · »

    Quick response Replay
    1Pers. read this topic (guests: 1)
    Users: 0

      Now: 29 July 2010 13:57

  •  
  • Tags