THE CREEPY WRITER, anonymous internet writer, humorist, and blogger.

I'm discovering what it means to be a do-it-yourself author and freelance writer, and what that means with the power of social media like Tumblr.</p> (<— variable) (<— block end) The block defines an area of code where something gets interpreted by Tumblr and displayed. From the Creating a custom HTML theme documentation provided by Tumblr, we see that and will render anything within it so long as the post has a description, and Hello. I am THE CREEPY WRITER, anonymous internet writer, humorist, and blogger.

I'm discovering what it means to be a do-it-yourself author and freelance writer, and what that means with the power of social media like Tumblr. will show the actual description itself. The way this works is, when Tumblr loads your theme, it takes the variety of Tumblr codes and replaces them with the actual data you want to see. Your blog title, image, colors, font choices, posts, custom pages, and whatever else all get populated during this stage. There are a lot of different types of variables and blocks that you can see on that page. This brings us to the magic of the variable. When put inside a , it gets replaced with HTML friendly versions of the names of whatever you’ve tagged your post with. Let’s get familiar with your theme. Go to your blog. Hit the customize button. Hit the “Edit HTML” button underneath the theme image. Copy everything you’ve got there and back it up to a .txt file or some other place. You may want to create a new copy and edit from there—Tumblr’s custom HTML editor can be a pain. Alternatively, you can use something like Mozilla Thimble so that you can see all the pretty colors associated with HTML markup. Don’t expect the preview button to give you an accurate representation, however, because only Tumblr will correctly interpret Tumblr code. Hit Ctrl + F to search and search for “”. Just look around a bit. You should see a bunch of {/block} of varying types—Text, Audio, Photo, Chat, Question, etc. These are the Tumblr codes for interpreting different types of posts that get published. What’s all this <div></div> stuff? <div></div> is markup to denote that whatever is between the two tags is marked as part of that “div”. Divs can be given an “id” or a “class”, which are used by CSS to reference everything within the divs and style them, giving them the graphic appearance that you see on Tumblr themes. You can even use CSS to hide specific divs. Remember graphic_design theme_design themes html css creepywriter creepyblogs tutorial prose? That’s going to be coming into play soon. So how does work? From the documentation, we see that “this block gets rendered for each post in reverse chronological order”, meaning that for every post, we get everything inside of with the new stuff at the top. This means that for every post, you’re going to have a separate set of <div></div>s. You can pop into the class of these divs in order to give them the classes that you tag them as, and with CSS, we’ll be hiding these posts later. Figure out what <div> you need to insert into. Depending on your theme, you might already see somewhere in your . If that’s the case, then your job is done and you can move on. If not, you’re going to need to figure out how your theme designer set up your section. There’s generally two iterations of this that I’ve seen: a single <div></div> (usually <div class=”post”>) that encapsulates all of the post types, including meta info, permalink info, etc. individual <div></div>s within each post type (usually something like