Easy Ways to Make Tumblr Theme (Code Structure)

Tumblr.com is a Blog which is unique compared to other types of blogs such as WordPress and Blogspot. Way in the writing tumblr blog is divided into 7 main categories, namely Text, Photo, Link, Quote, Chat, Audio, Video. If we want to write a quote, then we can directly publish without filling the title of Quote. To know more please visit the website features only Tumblr

Creating Your Own Tumblr Theme

As with other blogs, Tumblr also liberated for us to create our own theme, create a theme that is unique and different from other Tumblr users.

first step before we make a Tumblr theme is how to know the tumblr theme code works, then let us learn the structure of theme code tumblr.

Structure Tumblr Theme Code

Tumblr code structure is easy to implement in html / css, only need 1 file to generate a theme on tumblr, CSS and HTML code put together in one file.

Tumblr has 2 types of special operators are used to display


Variable: Variables are used to insert dynamic data such as the blog title and description.
Example: displays the blog title = {Title}




   
       
   

   
        ...
   



2. Block: To view postings, text, photo, paging post and so forth.
Example: display post = {block: Posts} ... {/ block: Posts}


   
       

            {block:Posts}
               

...

            {/block:Posts}
       
   


3. Here are some basic variables to HTML Head area:

{Title}: Showing Title of Blog Tumblr.
{Description}: Description of Tumblr Blog.
{MetaDescription }: Showing Meta Description dr tumblr blog.
{RSS}: link Blog RSS Feed Tumblr.
{Favicon}: Link favicon Tumblr blog.

For incorporation in HTML like this:


   
       
       
       
        {block:Description}
           
        {/block:Description}
   
   
       ....
   


Displaying Block Post to Text

{block:Posts}
     {block:Text}
         

                {block:Title}
                     

{Title}

                {/block:Title}
                {Body}
         
     {/block:Text}
{/block:Posts}

Block text on this post it looks like most blogs, which contain the post title and content, well above the code is invoked with variable content {Body}

Photo

{block:Photo}
     

         
          {block:Caption}
               

{Caption}

          {/block:Caption}
     
{/block:Photo}

{block:Photoset}
     

          {Photoset-500}
               {block:Caption}
                   

{Caption}

               {/block:Caption}
     
{/block:Photoset}

Quote

{block:Quote}
     

           "{Quote}"
           {block:Source}
                 

{Source}

           {/block:Source}
     
{/block:Quote}

Link

{block:Link}
     

          {Name}

          {block:Description}
               

{Description}

          {/block:Description}
     
{/block:Link}

Chat

{block:Chat}
   

         {block:Title}
             

{Title}

         {/block:Title}

         

              {block:Lines}
                   

                        {block:Label}
                             {Label}
                        {/block:Label}

                        {Line}
                   
               {/block:Lines}
         
     
{/block:Chat}

Audio

{block:Audio}
     

         {AudioPlayerBlack}

         {block:Caption}
             

{Caption}

         {/block:Caption}
     
{/block:Audio}

Video

{block:Video}
     

          {Video-500}

          {block:Caption}
               

{Caption}

          {/block:Caption}
     
{/block:Video}

7 types of post above is distinguishable, because the feature that distinguishes it from the others tumblr, so can create different layouts in each of 7 blocks to the post above, as we make the background text section lines as lines in the book, while the we can create a layout audio cassettes or LPs picture, we are free to express yourself with it.

Share this post