Our Network: VGFacts - DidYouKnowGaming? - The Spriters Resource - Muscle Tower

The Spriters Resource Community » Other Stuff » Questions, Info, and Tutorials v
Does anyone know how to write HTML?

User(s) Viewing This Thread: 1 Guest(s)
Thread Closed 
 
Thread Rating:
  • 0 Votes - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Does anyone know how to write HTML?
Author Message
Woppet* Offline
Can't stop this dog.
***

Posts: 1,142
Joined: Jul 2008
Reputation: 74
DeviantArt Facebook Resource - Sprites Steam Tumblr Twitter
Post: #1
Does anyone know how to write HTML?
I've been trying, to add a 780x150 header image to my blog on Tumblr.
But i literally have no clue how to do it.
I can edit the pages the html code, but it's all gibberish to me

This is the code for the theme

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
    
    <meta name="text:Twitter Username" content=""/>
    <meta name="text:Flickr Username" content=""/>
    <meta name="text:Disqus Shortname" content=""/>
    <meta name="color:Asterisk" content="#17f0ff"/>
    
    <title>{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>
    <link rel="shortcut icon" href="{Favicon}" />
    <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}"/>
    <link href="http://static.tumblr.com/xz44nnc/qVpkyo84x/style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="http://static.tumblr.com/xz44nnc/o5lkyivqw/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="http://static.tumblr.com/xz44nnc/k24kyivst/poop.js"></script>
    <style type="text/css">
        ol#nav li.home a { color: {color:Asterisk}; }
        
        /* Source logos */
        #content .meta a img {
            border: none;
            background: none;
            padding: 0;
            margin: 0;
            vertical-align: text-top;
            -moz-opacity: 0.1;
            opacity: 0.1;
        }
        
            #content .meta a:hover img {
                -moz-opacity: 0.15;
                opacity: 0.15;
            }
        
        
        {CustomCSS}
    </style>
</head>    
<body>

<ol id="nav">
    <li class="home"><a href="/" title="{Title}">*</a></li>
    <li><a href="/">{lang:Home}</a></li>
    {block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}{/block:HasPages}
    {block:AskEnabled}<li><a href="/ask">{AskLabel}</a></li>{/block:AskEnabled}
    {block:SubmissionsEnabled}<li><a href="/submit">{SubmitLabel}</a></li>{/block:SubmissionsEnabled}
    {block:IfFlickrUsername}<li><a href="http://flickr.com/photos/{text:Flickr Username}">Flickr</a></li>{/block:IfFlickrUsername}
    {block:IfTwitterUsername}<li><a href="http://twitter.com/{text:Twitter Username}">Twitter</a></li>{/block:IfTwitterUsername}
    <li><a href="/archive">{lang:Archive}</a></li>
    <li><a href="{RSS}">{lang:RSS}</a></li>
</ol>

<div id="content">
    <ol>
    {block:Posts}        
        {block:Text}
        <li class="regular">
            {block:Title}<h3><a href="{Permalink}">{Title}</a></h3>{/block:Title}
            {Body}
            <p class="meta"><a href="{Permalink}">{TimeAgo}</a> &nbsp;/&nbsp; <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{block:IfDisqusShortname} &nbsp;/&nbsp; <a class="dsq-comment-count" href="{Permalink}#disqus_thread">{lang:Comments}</a>{/block:IfDisqusShortname}</p>
        </li>
        {/block:Text}
        
        {block:Photo}
        <li class="photo">
            <p class="noborder">{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>{LinkCloseTag}</p>
            {block:Caption}{Caption}{/block:Caption}
            <p class="meta">
                <a href="{Permalink}">{TimeAgo}</a>
                &nbsp;/&nbsp; <a href="{Permalink}#notes">{NoteCountWithLabel}</a>
                {block:IfDisqusShortname} &nbsp;/&nbsp; <a class="dsq-comment-count" href="{Permalink}#disqus_thread">{lang:Comments}</a>{/block:IfDisqusShortname}
                {block:ContentSource}
                    &nbsp;/&nbsp;/{lang:Source}: <a href="{SourceURL}">{block:SourceLogo}<img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a></p>
                {/block:ContentSource}
            </p>
        </li>
        {/block:Photo}
        
        {block:Photoset}
        <li class="photoset">
            <p class="noborder">{Photoset-500}</p>
            {block:Caption}{Caption}{/block:Caption}
            <p class="meta">
                <a href="{Permalink}">{TimeAgo}</a>
                &nbsp;/&nbsp; <a href="{Permalink}#notes">{NoteCountWithLabel}</a>
                {block:IfDisqusShortname} &nbsp;/&nbsp; <a class="dsq-comment-count" href="{Permalink}#disqus_thread">{lang:Comments}</a>{/block:IfDisqusShortname}
                {block:ContentSource}
                    &nbsp;/&nbsp;/{lang:Source}: <a href="{SourceURL}">{block:SourceLogo}<img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a></p>
                {/block:ContentSource}
            </p>
        </li>
        {/block:Photoset}
        
        {block:Quote}
        <li class="quote">
            <blockquote>{Quote}</blockquote>
            {block:Source}<cite>&ndash; {Source}</cite>{/block:Source}
            <p class="meta">
                <a href="{Permalink}">{TimeAgo}</a>
                &nbsp;/&nbsp; <a href="{Permalink}#notes">{NoteCountWithLabel}</a>
                {block:IfDisqusShortname} &nbsp;/&nbsp; <a class="dsq-comment-count" href="{Permalink}#disqus_thread">{lang:Comments}</a>{/block:IfDisqusShortname}
                {block:ContentSource}
                    &nbsp;/&nbsp;/{lang:Source}: <a href="{SourceURL}">{block:SourceLogo}<img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a></p>
                {/block:ContentSource}
            </p>
        </li>
        {/block:Quote}
        
        {block:Link}
        <li class="link">
            <h3><a href="{URL}" class="link" {Target}>{Name} &rarr;</a></h3>
            {block:Description}{Description}{/block:Description}
            <p class="meta">
                <a href="{Permalink}">{TimeAgo}</a>
                &nbsp;/&nbsp; <a href="{Permalink}#notes">{NoteCountWithLabel}</a>
                {block:IfDisqusShortname} &nbsp;/&nbsp; <a class="dsq-comment-count" href="{Permalink}#disqus_thread">{lang:Comments}</a>{/block:IfDisqusShortname}
                {block:ContentSource}
                    &nbsp;/&nbsp;/{lang:Source}: <a href="{SourceURL}">{block:SourceLogo}<img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a></p>
                {/block:ContentSource}
            </p>
        </li>
        {/block:Link}
        
        {block:Video}
            <li class="video">
                {Video-500}
                {block:Caption}{Caption}{/block:Caption}
                <p class="meta">
                    <a href="{Permalink}">{TimeAgo}</a>
                    &nbsp;/&nbsp; <a href="{Permalink}#notes">{NoteCountWithLabel}</a>
                    {block:IfDisqusShortname} &nbsp;/&nbsp; <a class="dsq-comment-count" href="{Permalink}#disqus_thread">{lang:Comments}</a>{/block:IfDisqusShortname}
                    {block:ContentSource}
                        &nbsp;/&nbsp;/{lang:Source}: <a href="{SourceURL}">{block:SourceLogo}<img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a></p>
                    {/block:ContentSource}
                </p>
            </li>
        {/block:Video}
        
        {block:Chat}
        <li class="chat">
            {block:Title}<h3><a href="{Permalink}">{Title}</a></h3>{/block:Title}
            {block:Lines}<p>{block:Label}<strong>{Label}</strong>{/block:Label} {Line}</p>{/block:Lines}
            <p class="meta">
                <a href="{Permalink}">{TimeAgo}</a>
                &nbsp;/&nbsp; <a href="{Permalink}#notes">{NoteCountWithLabel}</a>
                {block:IfDisqusShortname} &nbsp;/&nbsp; <a class="dsq-comment-count" href="{Permalink}#disqus_thread">{lang:Comments}</a>{/block:IfDisqusShortname}
                {block:ContentSource}
                    &nbsp;/&nbsp;/{lang:Source}: <a href="{SourceURL}">{block:SourceLogo}<img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a></p>
                {/block:ContentSource}
            </p>
        </li>
        {/block:Chat}

        {block:Audio}
        <li class="audio">
            {AudioPlayerBlack}
            {block:Caption}{Caption}{/block:Caption}
            <p class="meta">
                <a href="{Permalink}">{TimeAgo}</a>
                &nbsp;/&nbsp; <a href="{Permalink}#notes">{NoteCountWithLabel}</a>
                {block:IfDisqusShortname} &nbsp;/&nbsp; <a class="dsq-comment-count" href="{Permalink}#disqus_thread">{lang:Comments}</a>{/block:IfDisqusShortname}
                {block:ContentSource}
                    &nbsp;/&nbsp; {lang:Source}: <a href="{SourceURL}">{block:SourceLogo}<img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}</a></p>
                {/block:ContentSource}
            </p>
        </li>
        {/block:Audio}
        
        {block:PostNotes}
        <li id="notes">
            {PostNotes}
        </li>
        {/block:PostNotes}
    {/block:Posts}
    
    {block:IfDisqusShortname}<li><script type="text/javascript">var disqus_url = "{Permalink}"; var disqus_title ="{block:PostTitle}{PostTitle}{/block:PostTitle}";</script>{block:Permalink}<div id="disqus_thread"></div><script type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script><noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript=jessakalani">comments powered by Disqus.</a></noscript><a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>{/block:Permalink}<script type="text/javascript">
    //<![CDATA[
    (function() {
        var links = document.getElementsByTagName('a');
        var query = '?';
        for(var i = 0; i < links.length; i++) {
        if(links[i].href.indexOf('#disqus_thread') >= 0) {
            query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
        }
        }
        document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>');
    })();
    //]]>
    </script></li>
    {/block:IfDisqusShortname}
    </ol>
    <div id="pagination">
        {block:NextPage}<a class="button next" id="next_page" href="{NextPage}">&larr; {lang:Older}</a>{/block:NextPage}
        {block:PreviousPage}<a class="button right" href="{PreviousPage}">{lang:Newer} &rarr;</a>{/block:PreviousPage}
    </div>
</div>
</body>
</html>

And here's a link to what it looks like:
http://woppet.tumblr.com/

I want the image right at the top of the page.

Can anyone tell me how i go about doing this?
10-11-2010 11:14 AM
Visit this user's website Find all posts by this user
Login or Register to remove these ads!
Nindo Offline
It's that bearded fellow!
*

Posts: 212
Joined: Aug 2010
Reputation: 23
Post: #2
RE: Does anyone know how to write HTML?
I'm assuming you want the header image left aligned? If you want it center or right aligned, the code will be a tiny bit different.
It's been awhile, but if I'm not mistaken all you need to do is put this line of code (I used the image in your sig as an example) just below the <body> tag:

<img src="http://i55.tinypic.com/s45ljp.jpg">


I'm not familiar with how tumblr does its layouts so that might not put the image precisely where you want. It might take a couple of tries fiddling with it, but it shouldn't be too much of a problem.
好love好
ref=Comrade>/Bk/C2B/Gors,1,2/魚/Sploder/
ref=Nindo>/Apk/Bk/Green/魚/unno/
misc>/Diogalesu/
[Image: fFrame1Big.gif][Image: Frame1Big.gif]
[devart]
(This post was last modified: 10-11-2010 03:47 PM by Nindo.)
10-11-2010 03:46 PM
Find all posts by this user
Woppet* Offline
Can't stop this dog.
***

Posts: 1,142
Joined: Jul 2008
Reputation: 74
DeviantArt Facebook Resource - Sprites Steam Tumblr Twitter
Post: #3
RE: Does anyone know how to write HTML?
Oh cool that's working, but it's too far to the left. Know how to center it?
Thankyou

I'd like to lower it a little too if that's possible?
So it isn't touching the top of the page
10-11-2010 04:04 PM
Visit this user's website Find all posts by this user
Nindo Offline
It's that bearded fellow!
*

Posts: 212
Joined: Aug 2010
Reputation: 23
Post: #4
RE: Does anyone know how to write HTML?
replace
<img src="http://i55.tinypic.com/s45ljp.jpg">

with

<p align="center">
</br>
<img src="http://i55.tinypic.com/s45ljp.jpg">
</p>

not sure how that will look since I myself can't test it, but that should
1. center it
2. drop it down a bit
好love好
ref=Comrade>/Bk/C2B/Gors,1,2/魚/Sploder/
ref=Nindo>/Apk/Bk/Green/魚/unno/
misc>/Diogalesu/
[Image: fFrame1Big.gif][Image: Frame1Big.gif]
[devart]
10-11-2010 04:16 PM
Find all posts by this user
Woppet* Offline
Can't stop this dog.
***

Posts: 1,142
Joined: Jul 2008
Reputation: 74
DeviantArt Facebook Resource - Sprites Steam Tumblr Twitter
Post: #5
RE: Does anyone know how to write HTML?
Thankyou. I fiddled with it for a while and i think i got what i wanted.
Turned out like: http://woppet.tumblr.com/

Thanks a lot bro!
10-11-2010 04:57 PM
Visit this user's website Find all posts by this user
Nindo Offline
It's that bearded fellow!
*

Posts: 212
Joined: Aug 2010
Reputation: 23
Post: #6
RE: Does anyone know how to write HTML?
No problem, looks good.
好love好
ref=Comrade>/Bk/C2B/Gors,1,2/魚/Sploder/
ref=Nindo>/Apk/Bk/Green/魚/unno/
misc>/Diogalesu/
[Image: fFrame1Big.gif][Image: Frame1Big.gif]
[devart]
10-11-2010 07:47 PM
Find all posts by this user
[-] Thanked by
Woppet* (10-12-2010)
Woppet* Offline
Can't stop this dog.
***

Posts: 1,142
Joined: Jul 2008
Reputation: 74
DeviantArt Facebook Resource - Sprites Steam Tumblr Twitter
Post: #7
RE: Does anyone know how to write HTML?
Thankyou! Guess i can lock this now.
10-12-2010 12:22 AM
Visit this user's website Find all posts by this user
Thread Closed 


Forum Jump:


 Quick Theme:


Login or Register to remove this ad!
Contact UsThe Spriters ResourceReturn to TopReturn to ContentMobile VersionRSS Syndication