Popular tags :
-- : -- : --
 

SubscribeBlog Updates


Latest Comments

  • blog post Report HINT - Permalinks

    Bruce
    Posted on Feb 5, 2010 - 9:00 by Bruce
    • Edited By Bruce on Feb 5, 2010 - 9:09

    http://img.uvumi.com/photos/1013/big/permanentlink.png


    Do you all know about the Uvumi Permalink dialog? At the top of most pages on the black bar, the path to the page is displayed on the left side. Usually there will be a little chain-link button at the end of the path. If you click that, you will open the Permanent Link dialog, which has several links to that page, including one that has the appropriate avatar.

    Just Copy/Paste these links wherever you want. Among others, you'll find the Parmalink dialog for profile pages, blog entries, song pages, and playlist pages. So share music with others by posting song links or playlist permalinks!

    There's more detail here: Post Markup on Uvumi
  • blog post Report Featured Song Template for your Bio

    Bruce
    Posted on Feb 2, 2010 - 11:15 by Bruce
    • Edited By Bruce on Feb 8, 2010 - 14:33
    Here's a template you can fill in with your own songs on your Bio.


    featuredsongs-notes.png

    Upcoming Blues on Uvumi.com Marshall Stokes - Upcoming Blues

    This Place We're In on Uvumi.com Van Wampler = This Place We're In
    get this





    Copy/Paste This Template



    1. Highlight and copy all the HTML code in the box. Paste that into your bio.

    2. Fill in the song(s) of your choice. To get the image link for a song, click open the song's permalink and copy the link for the mini avatar version. See my blog Song Links for more details about song links.

    3. You might want to change the "on Uvumi.com" part to the artist and title.

    It should be pretty obvious which chunk of text you need to replace in this example to add your own selections - a song link starts with "<a" and ends at "</a>.

    Copy/Paste HTML in box



    <p style="float:left;font-size:120%;color:#000000;background-color:#FFFFCC;padding-left:25px;padding-right:25px;border:solid #eeeebb;">
    <img src="http://img.uvumi.com/photos/1013/big/featuredsongs-notes.png" alt="featuredsongs-notes.png" />

    <a href="http://uvumi.com/marshall"><img src="http://uvumi.com/marshall/avatar/mini" style="vertical-align=middle" alt="Upcoming Blues on Uvumi.com"/></a> <a href="http://uvumi.com/marshall/songs/47">Marshall Stokes - Upcoming Blues</a>

    <a href="http://uvumi.com/vanwampler"><img src="http://uvumi.com/vanwampler/avatar/mini" style="vertical-align=middle" alt="This Place We&#039;re In on Uvumi.com"/></a> <a href="http://uvumi.com/vanwampler/songs/2774">Van Wampler = This Place We&#039;re In</a>

    <span style="float:right;font-size:70%;color:#606060;"><a href="http://uvumi.com/#bruce/blog/276">get this</a></span>
    </p>
    <br style="clear:both;" />

    Customize Your Template


    You can customize this template, if you wish. The top "Featured Songs" bar is called "featuredsongs-notes.png". You can change that to a graphic of your choice, but it should be 512 pixels wide. And you can change the background color and border by making appropriate changes to the first <p> definition. See Post with Style for more info on that.
  • blog post Report Post with Style

    Bruce
    Posted on Feb 1, 2010 - 6:30 by Bruce
    • Edited By Bruce on Feb 3, 2010 - 15:36
    Uvumi allows you to mark up your bios and blogs using many (but not all) standard HTML tags. The basics are covered in my tutorial: Post Markup on Uvumi.

    This tutorial goes into greater depth on how to use HTML tags, and how to add style properties to those tags. Probably the most useful tags that you might want to add style to are <h1>, <p>, and <span>.

    What is style?



    A style is a property you can add inside an HTML tag - one Uvumi, probably the <p>, <span>, or <h1> tags. The general form to add one style property looks like this: <html-tag style="property:value">

    For example, if you want the color of some text to look red, the style attribute would look like this: style="color:red"

    The style property is "color". The value of the color is "red". Notice there is a colon in between color and red, not an equal sign, and there are no extra quote marks. (There are many ways to specify color - a Google search for "html color codes" will give you plenty of help.)

    Now, you just insert this into an HTML tag, such as the < span > tag. The span tag is commonly used to apply some style to a block of text. Remember to close the tag when you are through or you will have more red text than you bargained for!

    For example, <span style="color:red">This text is red!</span> gives you: This text is red!

    You can also apply more than one property in the style attribute. Place a semicolon after your first property and value, and add another. So, we can make large, bold, green text with a yellow background using this tag:

    <span style="font-size:large;font-weight:bold;color:blue;background-color:yellow">Large, bold, blue</span> gives:
    Large, bold, blue

    Style properties you can use



    The following list of allowed properties was furnished by Uvumi. Thanks!
    Note: Values listed are not necessarily comprehensive - but commonly used ones.

    Text Properties

    text-decoration: Adds decoration to text
    Values: none, underline, overline, line-through, blink
    text-align: Aligns the text in an element
    Values: left, right, center, justify
    color: Color of text in an element
    Values: color name (e.g., red, blue), #XXXXXX (rgb hex), others
    font-size: font size of text.
    Values: nn% - percent of default (recommended for Uvumi); also size such as small, medium, large; or points (00pt)
    font-weight: weight of font
    Values: normal, bold, bolder, lighter, 100, 200, ..., 900
    font-style: font style
    Values: normal, italic, oblique
    background-color
    Values: usual colors

    Padding and Border Properties

    border: width, style, color of all 4 borders
    border-top, border-bottom, border-left, border-right: of one border side
    Values: width - size, usually in px (e.g., 4px); style - none, dotted, dashed, solid, double, groove, ridge, inset, outset; color: usual for color
    padding: Sets all padding properties in one declaration (top, right, bottom, left)
    padding-top, padding-left, padding-bottom, padding-right: Sets padding on specific side
    Values: pixels (e.g., 25px)

    Positioning Properties

    float: Specifies how a < p > or < span > should float. A floated element will move as far to the left or right as it can.
    Values: left, right
    clear: Clears previous float properties to get back to default display
    Values: both

    Two Column Layout



    This is column 1. Enter each
    line on a separate line in
    the edit window. Width is
    determined by what you type.

    This is the second column. We've
    added a background, and made the
    font bold and blue.





    The corresponding code:

    <h1 style="border-bottom:2pt solid #FFFF00;">Two Column Layout</h1>

    <p style="float:left;font-size:125%;color:#101010;background-color:#44cc44;padding-left:25px;padding-right:25px;">This is column 1. Enter each
    line on a separate line in
    the edit window. Width is
    determined by what you type.</p><p style="float:right;background-color:#8888ff;padding:10pt;border:2pt solid #000088;font-weight:bold;color:#0000FF;">This is the second column. We've
    added a background, and made the
    font bold and blue.
    </p>
    <br style="clear:both;" />





    Do you have more good examples? Post a comment, or send me a private e-mail, and I'll add them!
  • blog post Report Song Links

    Bruce
    Posted on Jan 31, 2010 - 7:15 by Bruce
    • Edited By Bruce on Feb 8, 2010 - 14:36

    How to add an image song link to your posts



    Would you like to make a link like this for your bio song list and in comments? This tutorial will let you do that.

    This Place We're In on Uvumi.com Van Wampler - This Place We're In

    Here's the short summary of how to do that - specific details follow.

    1. Copy song image link from the song's Permalink dialog box (either the small or mini image). Paste that into your bio/entry edit window.

    2. You might want to change the "Title on Uvumi.com" to "Artist - Title"

    3. Post your bio/comment.

    The Details


    1. Getting the Permalink

    Click on a song's title to navigate to the song's page. At the top of the page is a black bar with a link to the song's Permalinks as provided by Uvumi:

    http://img.uvumi.com/photos/1013/big/song-link-bar.png

    Click the chain/link to get the Permalink dialog box:

    http://img.uvumi.com/photos/1013/big/permalink.png

    Select and copy one of the image song links and copy it (e.g. Ctrl-C on Windows, Command-C on a Mac). Paste (Ctrl-V/Cmd-V) that into your bio/blog/comment.

    2. Add the song's artist and title

    The default link includes "on Uvumi.com" which is useful if you post the link on another web site. But you might want to add the artist name and remove the "on Uvumi.com" for posts here. It is easy to edit that part.

    You're done! You now have a complete song link with mini avatar, title, and play/queue buttons.

    Note the the avatar link will bring up the artist page, and the song title will bring up the song page. Of course, the play button plays the song!

    We ALL have a standard avatar address


    Note: Uvumi stores 3 sizes of photos for each artist's avatar (and users, too) - a big, a small, and a mini. And the address of the three avatars is always the same, and will always show the current avatar. The address looks like:

    http://uvummi.com/user/avatar/mini

    Substitute the artist/user name of you profile page (e.g., bruce or vanwampler or your own) for user and mini, small, or big for the size. And you have to use these with an <img> tag, not directly (you get a link that will display strange characters). So for example, my small avatar:

    <img src="http://uvumi.com/bruce/avatar/small"> : small
  • blog post Report Post Markup on Uvumi

    Bruce
    Posted on Jan 26, 2010 - 10:45 by Bruce
    • Edited By Bruce on Feb 8, 2010 - 14:50
    Uvumi allows you to add some dazzle to your posts. You do this by adding what is known as markup to your posts - that is you bracket your text with special tags that will then display them with bold, italic, color, and more.

    This article is a guide to the basic markup supported on Uvumi. The markup is a limited set of standard HTML. If you already know HTML, this will be easy for you. If you don't, you should still be able to make some nice posts just by following the examples here.

    Additional Tutorials:

    This article discusses the basics of markup on Uvumi. For more discussion on some specific topics (e.g., song links), or more advanced information, you can read the following articles:


    Text



    Bold - <strong>Bold</strong>
    Italic - <em>Italic</em>
    Underline - <u>Underline</u>
    Strikethrough - <strike>Strikethrough</strike>

    Horizontal Line: <hr />



    Use <h1>Header Title</h1> to get headers like the following:

    Links



    There are two ways to post links. The easiest is to simply include the link in your post, and it will show up like this:

    http://uvumi.com/bruce/blog/178

    You can also use full HTML markup for the link so that you can have the link appear with text of your choosing instead of just an address:

    Post Markup on Uvumi - <a href="http&58;//uvumi.com/bruce/blog/178">Post Markup on Uvumi</a> (This is in fact the real address for this entry, so please share it!)

    Permalinks



    For many pages - your own profile page, blog entries, songs, playlists, and others, Uvumi provides an easy way to get a permanent link to that page. Whenever you see a little chain link at the end of the path description on a page, you can open the Permanenet Link dialog.

    http://img.uvumi.com/photos/1013/big/permanentlink.png Click to get: http://img.uvumi.com/photos/1013/big/permalinkdialog.png


    You can now copy/paste any of the links there. They are great for putting on another web site or blog, or you can use them in your posts on Uvumi. Just watch for the little link.

    Note that the avatar image is a link that will go to the user or artist profile page, while the text link goes to the specific page - blog, song, etc.

    Songs



    This entry covers the basics of entering a song link. See Song Links for a more complete tutorial on song links.

    There are three easy ways to add a song link to your posts. The first thing you have to do is get the song's address. You need to open the song's page, most easily done by clicking on a link to the song. Then you can either copy the address from your browser's address bar (usually right-click/copy), or open the song's permalink dialog box by clicking the little chain link at the end of the song path description on the black bar near the top of the page.

    Then you have three choices:

    1. Simply paste the link into your entry. You will get a link and a play button that looks like this:
    http://uvumi.com/vanwampler/songs/2774

    2. Use the link, but add the <a> link tag as described in the last section to add the artist and title:
    Van Wampler - This Place We're In

    3. Copy the song image link from the song permalink dialog to get this:
    This Place We're In on Uvumi.com This Place We're In on Uvumi.com

    The player button gets added automatically by Uvumi. You can edit the Song title if you wish.

    Now go out and share some songs!

    Images



    uvumi-logo-128x42.png - <img src="http://img.uvumi.com/photos/uvumi-logo-128x42.png">

    You can also simply give the http:// link to the image.

    Note the image should be at a permanent location. One way would be to upload some images to your Uvumi photo album, and use them. To get the address of an image from your photo album, open the photo in your album, then right-click to view the photo in a new browser window or tab. You'll see just the photo and its address in the browser address bar. Uvumi hosts two version of each image - a small thumbnail shown the the album view, and a big one shown when you open that image.

    Summary of what HTML tags are allowed



    This section is a summary of the HTML tags Uvumi supports. This is precise (from information provided by Uvumi), but might be a bit techie for some. There are some examples on using the style attributes in the article: Post with Style


    • Here is the list of tags allowed in blog and bio posts:

      <a>, <img>, <strong>, <em>, <i>, <u>, <b>, <br>, <hr>, <ul>, <li>, <s>, <strike>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <p>, <span>, <code>


    • Posts to Comments don't give as much freedom:

      <a>, <img>, <strong>, <em>, <i>, <u>, <b>, <br>, <p>


    • Uvumi allows the <a> tag so you can make nice links as described in the Links section, but will also try to convert a url on it's own like this: http://uvumi.com

      Same thing with a link to an image, if it's not inside an anchor's href, Uvumi turns it into an <img>.

    • You can also paste embed code or links to popular video websites (youtube, vimeo, dailymotion...). Uvumi will automatically convert a direct link to a video into the video itself, when possible. So in most cases, you just need to grab the link.

    • <a> allows the "href" property obviously, <img> allows "src", "border", "alt", "width" and "height", <p> let you use "align" so you can justify or center a block of text.

    • Each tag allows "style". Yeah that sounds risky to let people mess with style but we don't allow just any style property, many are forbidden. This is mostly to let you change the font color and size, the background, padding.
      And that's only for blog post, comments don't allow style.




    I would like to thank the Marshall and Olivier from Uvumi for all the help they've provided for these tutorials. The information provided here would not have been possible, nor accurate, without their help.

Register a new account.
Forgot your password?

Sharing box

Share this page:    

Copy/pasteable HTML: