- How do I make my Tumblr HTML?
- How do you edit HTML on Tumblr mobile?
- How do you format a blog on Tumblr?
- Is Tumblr still active 2021?
- What app makes aesthetics?
- Build Themes
- HTML head
- Uploading theme assets
- HTML body
- Masthead
- Special pages
- Content
- Pagination
- Tumblr Tips: Using The HTML Text Post Editor To Write Your Article
- How to access the Tumblr HTML text post editor?
- Tumblr HTML text post editor tips
How do I make my Tumblr HTML?
When using Tumblr, you basically have your own website. But the way Tumblr structures their theme-creation is unique to Tumblr: it’s not like building a normal website. Sure, it requires basic HTML and CSS. But it also uses a bunch of special variables and blocks that are special to Tumblr.
How do you use Tumblr codes?
For this please follow these basic steps:
- Go to you Tumblr Blog >> Customization page >> Click the “Edit HTML” button to edit your existing theme.
- Remove the existing theme code.
- Open tumblr.
- Paste the copied Artisteer theme code to the Tumblr HTML area.
- The Save the changes.
How do you create a website on Tumblr?
How to Make a Professional Website or Portfolio on Tumblr in 5…
- Create a “blog” on Tumblr. Create an account on Tumblr, or start a new “blog” if you already have an account.
- Choose a theme.
- Upload art via posts & add tags.
- Customize your site.
- Add your own domain name (optional)
- Fin.
How do you edit HTML on Tumblr mobile?
The mobile apps only support the Rich text editor. If you’d prefer to create and edit posts in HTML or Markdown, just click the settings gear in the upper-right corner of the post form. You can switch between HTML, Rich text, and Markdown editing in the menu that shows up.
How do you format a blog on Tumblr?
How to Format Your Tumblr Blog
- Bold: Make any text in your blog post bold by clicking and dragging over the text that you want to affect and then clicking the Bold icon.
- Italic: Italicize any text in your blog post by clicking and dragging over the text that you want to affect and then clicking the Italic icon.
How do you make Tumblr aesthetics?
- Navigate to tumblr.com/themes.
- Click “Preview” to view a full screen preview of a Tumblr theme.
- Click “Install” to apply the Tumblr theme to your blog.
- Click the “Choose Blog” drop-down menu and select the Tumblr blog you want to customize.
- Click “Install Theme” to apply the theme to your blog.
How do I edit my Tumblr on mobile?
If on an iOS device, go to your blog and press the user menu. Then select Edit Appearance, and get crazy with the customizing. On the Android app, pull up your blog and press Edit to start changing colors, fonts, and pictures.
Is Tumblr still active 2021?
The microblogging and social network has 518.7million blogs hosted on its site as of February 2021 (Tumblr, 2021). It is one of the many blogging platforms where over 32 million bloggers in the US alone reside (FirstSiteGuide, 2021). According to Tumblr, 12.8 million blog posts are published daily (Tumblr, 2021).
What app makes aesthetics?
You can use apps such as VSCO and Lightroom to add aesthetic presets on to your photos. You can use Adobe Photoshop Express if you’d like to make collages and add text to your edited photos.
Build Themes
Every Tumblr theme, like any HTML website, needs a couple of elements.
Here is the basic HTML structure of the example theme built throughout the book with some Tumblr-only variables and blocks:
Let’s break this boilerplate code into its parts, and discuss the special Tumblr variables used.
HTML head
is used by search engines to crawl the page and display a short snippet of descriptive information about the page.
This complex bit of code is used for displaying an accurate title, which is used in search engine results and the name on tabs in browsers. Here is what it does:
- checks if the visitor is on a tag page, with a URL of the format of http://blog.tumblr.com/tagged/tag. If the user is on a tag page then the title of “Tag — Title” will be shown as the title.
- checks if the user is on a search page. If they are then “Search results for SearchQuery — Title” is the tile.
- Finally, uses a title, where possible, or a summary of the post content (if the user is on a post page) to generate a title like “Post name — Title”
Note that since the user can only be on one type of page, the correct page title will be shown. For example, you can’t be on both a post page and a tag page!
The RSS link helps RSS readers automatically find the feed for the blog. The favicon is the small icon visible on tabs (shown below) and the taskbar.
As the name “apple-touch-icon-precomposed” suggests, the portrait image will be used for as a home screen icon for the blog on some Apple devices.
For this project we’ve linked an external CSS file called Normalize.css, which is a handy CSS file that “targets only the styles that need normalizing”, an alternative to resetting styles to aid cross-browser compatibility in our CSS styles.
I have written most of the CSS used in the example theme, and placed it in an external file called theme.css. It is just a plain CSS file, so you are able to open it in your favorite text editor and have a read of the CSS.
Most of the CSS is provided up-front as this book is focused on the Tumblr-specific elements of web development, so we won’t spend time on styling specific elements of the theme.
The CSS references the classes and IDs added later in the theme’s HTML.
Uploading theme assets
For theme assets such as external JavaScript, CSS and images, you should upload files to the Tumblr server.
This is to ensure your external assets are always available on Tumblr.
Clicking on “insert”, will give you a URL which you can reference in your theme code (much like I have done for with the URL for theme.css above).
HTML body
The theme’s body will be structured into:
The further sections of this chapter will explore, in-depth, how to build these sections.
Masthead
The masthead/header will contain blog metadata, page navigation and search.
Special pages
In tag and search pages, a special message is displayed with feedback about the tag or search results.
Content
The vast majority of the theme markup will be kept in the main block, with the HTML for all the different post types in this area.
Pagination
Also included in the boilerplate HTML is the pagination markup discussed earlier, for navigation between pages. Visit the end of the variables and block section to read the explanation again.
Tumblr Tips: Using The HTML Text Post Editor To Write Your Article
Are you planning to use the HTML text post editor to write your posts on Tumblr (microblogging platform and social networking site)? Here are some tips to keep in mind and to take note of.
How to access the Tumblr HTML text post editor?
To find the HTML part of the text post editor, click on the small gray wheel or icon that appears on the upper right side of the textbox where you’re writing your article.
A box will drop-down and you will see “text editor” at the bottom of the box. Beside it, you will see the word “rich text” along with a down arrow.
If you click this arrow, you will see the option to choose the HTML format. Selecting this will bring you to the HTML version of the post you’re currently working on.
Tumblr HTML text post editor tips
- Before going to the HTML view, make sure that you finish everything that you need to do in the rich text format first
- It’s best if you don’t try to switch back and forth between the editors because it’s highly likely that the rich text format will remove all the HTML codes that you just added to your post. I experienced this and it was very frustrating, to say the least, since I had to add all the codes I just added all over again
- Be prepared to see one giant block of text when you get to the Tumblr HTML post editor. This is actually very annoying because the entire text of your article is displayed in one huge paragraph block that can hurt your eyes especially if your post is long. All the spaces that you added in the rich format will disappear and you’ll see nothing but a wall of text
- Don’t panic about this though. If you preview your post, you’ll see that it still looks perfectly fine and has all the spaces that it initially had in the rich text editor. The reason for this is that, while the HTML editor displays all the text in one giant blob, it doesn’t remove the paragraph tags (the ) and this is what’s really important
- With that said, you can safely add spaces to your post in HTML mode, which is great so you don’t have to strain your eyes or give yourself a headache looking at one giant block of text
- When you add the spaces, make sure that each of the
has a closing
to mark each new paragraph
By the way, it’s also important to note that the Tumblr HTML editor doesn’t care about spaces. It only considers one space so no matter how many times you press the enter key or the space bar and even if it looks like your post has a lot of spaces, if you preview your post, you’ll see that the spaces you added did nothing at all. Well, that’s all for now. If you need any help, feel free to ask and I’ll get back to you as soon as I can.