(Note: Fiorella is a premium Tumblr theme with an optional fixed sidebar and many more options and features. You can buy it here. This blog is Fiorella’s demo blog. You can learn more about Fiorella in this post. You can use this link to buy Fiorella and get a discount.)
Just got this email from Tumblr about this demo blog turning 3 on February 11, 2018.
As I mentioned in this post, I’ve been really busy, so I’ve been on a very long hiatus from Tumblr. This is why I haven’t been able to post this before. But now I’m trying to be more active here again.
I’d like to be able to publish all the articles on the drafts page of all my Tumblr blogs as well as post the emails I’ve received about all the achievements and milestones my Tumblr blogs have gotten.
One of the things that I’ve been busy working on was creating and making more Tumblr themes. In this post about Fiorella’s second birthday, I talked about working on a new Tumblr theme, which I’d hoped to be able to finish soon.
The theme I’m talking about in that post is actually Clarent. I’ve just finished working on it, and it is now available for sale on Gumroad.
Clarent comes with a fixed sidebar, sidebar slider, fixed footer bar widget, and a whole lot more options and features. It supports Tumblr’s new Related Posts and Highlighted Posts features as well as Tumblr’s built-in audio and video players.
You can check out the demo blog here. Aside from sample posts and sample reblogged posts, it also has theme documentation and tutorials. You can learn more about Clarent in this post and this one.
You can also check out the rest of the themes I’ve made on Gumroad using this link: https://gumroad.com/freyayuki. Check out my themes page and themes blog for more info. I also have a themes list page where you can see a quick overview of all the themes I’ve made so far.
If you have any questions or if you need some help, please feel free to contact me, and I’ll reply as soon as possible.
(Note: Rei Asa is a premium Tumblr theme with a portfolio cards widget, full screen search feature, modal menu, and many more options and features. You can buy it here. This blog is Rei Asa’s demo blog. You can learn more about Rei Asa in this post.)
Just got an email from Tumblr about this blog turning 1.
Well, to be more precise, it’s been quite a while since I got the email, but I only just now got ‘round to posting this due to being very busy lately. One of the things I’ve been working on was creating more Tumblr themes.
Recently, I’ve released the Arica Tumblr theme. Arica comes with a header slider, Tumblr’s Related Posts and Highlighted Posts features, a fixed navbar, a 2-column footer, and more.
You can learn more about the Arica Tumblr theme from this post. This one has a full list of all of Arica’s theme documentation and tutorials. The demo blog can be found here.
Arica is available for sale on Gumroad: https://gumroad.com/l/arica-theme.
Currently, I’m working on a new Tumblr theme, which I hope to be able to finish soon.
You can also check out my themes blog and my themes page on Gumroad for a list of all the themes I’ve made so far. If you have any questions or if you need some help, feel free to contact me, and I’ll get back to you as soon as possible.
Hello Mr./Mrs I am a professional free blog website maker. I can customize any blog website. I will make a free blog website for you very cheap rate. I can also redesign your blog pictures. So feel free to work with me.
How to Customize the Jelana Tumblr Theme Text Options?
This post will show you how to customize the text options of your blog if you’re using the Jelana Tumblr theme. To get started, go to the theme options page of your blog.
Here are the meanings and explanations for each of these text options:
Just leave the textboxes blank if you don’t want to display these features.
Font Family and Font Style
If you want to use Google Fonts instead of Tumblr’s built-in fonts, then refer to the following options:
Blog Title Font - the font family for the title of your blog
Post Title Font - the font family for the titles of your blog posts such as Chat and Text posts. This includes caption titles (if you turn on the caption titles feature) for Photo, Panorama, Photoset, Video, Link, and Audio posts.
Body Font - the font family for the body part of your blog such as the contents of your posts
Quote Font - the font family for quotes in quote posts. This applies only to the quote itself as well as the first line in the body of the quote post (for the author or source of the quote).
The rest of the text in the quote post uses the Body Font.
Go to https://fonts.google.com/, copy the name of the font/s you want to use then paste them on the appropriate textboxes.
Blog Title Font Style, Post Title Font Style, Body Font Style, and Quote Font Style - the style of the font family font. For example, bold or italic.
For the font styles:
On the Google Fonts site, click the name of the font you want to use
On the popup box that shows up, click the Customize tab
Put a check on the styles that you want to use
Go back to the Embed tab
You will see symbols of the font style next to the font family name
Copy this style and paste it on the appropriate textbox on your blog’s theme options page
Add : (colon) before the style
For example, the Jelana demo blog’s Post Title Font is Playfair Display. The Font Style is :bi. This means the style is bold italic. You can also use :700i.
Here’s a screenshot for reference:
The pic above is from this article.
Font Size
To customize the font sizes of various text elements in your blog, refer to the following options:
Blog Title Font Size - font size of the title of your blog
Post Body Font Size - refers to the font size for the body part of your posts
Post Info Font Size - refers to the font size of the info or meta part of your posts
Quote Font Size - font size of quotes in quote posts. This includes the first line of the body of quote posts (the author or quote source).
Blockquote Font Size - font size of blockquotes in the body of your posts.
This is a sample blockquote
Heading 1 Font Size - the font size for the titles of posts, tag pages, day pages, and search pages
Heading 2 Font Size - font size for the article titles of Link Posts and the names of the asker and answerer in Answer Posts
In the above pic, the “Buy Premium Tumblr Themes by Freya Yuki” has the Heading 2 Font Size while the “Sample Link Post” has the Heading 1 Font Size. The “On Jelana...” has the Post Body Font Size.
In the pic above, both the “Anonymous asked” and the “potter-plotholes said” have the Heading 2 Font Size.
Heading 3 Font Size - refers to the font size for the following:
the Follow me heading of the social media icons
the exif data heading for Photo and Panorama Posts
the audio track info heading for Audio Posts
the notes count heading
the comments heading
the highlighted posts heading
the likes heading
the follows heading
the group blog members heading
the Twitter widget heading
the Pinterest widget heading
the Facebook widget heading
Header Content Font Size - refers to the font size for the contents of the header. This includes the tagline and the header widget.
The tagline shows up right below the blog title. On smaller screens, the header widget shows up below the tagline. On larger screens, the header widget shows up to the right of the blog title and tagline.
You can put anything you want on the header widget including images, HTML, javascript, or just plain text.
Sidebar Font Size - refers to the font size for the contents of the sidebar. This includes the font size for the description of your blog and the sidebar widget
Navbar Font Size - font size for the contents of the navbar including the icons and the custom link
Navbar Dropdown Font Size - font size for the contents of the navbar that open inside a box, container, or dropdown format. This includes the Menu Links (submit a post, RSS feed, Archive, and Random) and the Pages Links (pages you add to your blog)
For more info about the navbar and how to customize it to your liking, refer to this.
Footer Font Size - font size of the footer section of your blog
Cookie Consent Font Size - font size for the cookie consent notice widget. Refer to this post for more info
Exif Data and Audio Info Font Size - font size for the contents of the exif data and audio info
Back To Top Button Font Size - font size of the back to top button
All the font sizes are in rems.
Line Spacing
Posts List Spacing - spacing between ordered and unordered lists
Posts Heading Spacing - spacing between headings
Posts Paragraph Spacing - spacing between paragraphs
Check out the Jelana Tumblr Theme demo blog’s Sample Text Post for examples.
Other Text Options
Blog Title On Hover - if you hover your mouse over the title of your blog, you will see a tooltip. You can customize the text on this tooltip
The Blog Author Name will let you identify yourself as the author or owner of your blog.
This is the author meta tag that will let search engines know who the author or owner of a blog or website is.
To add this, all you need to do is look for the Blog Author Name option.
Then just type your name, username, or whichever name you want the author of your blog to be known as, and you’re all set.
Highlighted Posts Text - refers to the heading for the Highlighted Posts feature. Check out this post for more info.
Change the contents of the following options to customize the text and links of the cookie consent notice banner:
Ask Page Text - way back in 2015, I wrote this post on how to add text to your Tumblr Ask page.
The method to do this is easy enough, but, using the Jelana Tumblr theme, it’s even easier, not to mention faster, because, now, all you need to do is fill in the Ask Page textbox, and your Ask page can look something like this:
Note: to display the ask and submit pages of your blog, you need to turn on these features on your blog settings:
Audio Info Text - heading of the audio or track info of Audio Posts
Exif Data Text - refers to the tooltip text that shows up when you hover your mouse over the camera icon if you choose to display exif data and if it is available. This also refers to the exif data heading for Photo and Panorama Posts.
Change the Background Image Opacity depending on how transparent you want your blog’s background image to be. Refer to the Add Opacity To Background feature for more info.
Custom Link Text - text content of the custom link. On the Jelana Tumblr Theme’s demo blog, the custom link text is Tumblr Themes
Custom Link URL - URL link of the custom link. On the Jelana Tumblr Theme’s demo blog, the custom link URL is https://gumroad.com/freyayuki
Menu Links Tooltip - text that shows up when you hover your mouse over the burger menu icon (the icon with three horizontal lines) in the navbar section of your blog.
Look for the Post Widget option to add content to the widget that shows up after your posts. This widget will only show up on post permalink pages.
Footer Widget 1 and Footer Widget 2 - contents of the footer section of your blog
Sidebar Widget - contents of the sidebar widget
Header Widget - contents of the header widget
Header Tagline - contents of the header tagline
Google Analytics will let you track your traffic and get more data and info about your blog. To use this, add your Tumblr blog to your Google Analytics account then get the given ID.
Back on the theme options page of your blog, scroll down until you find the Google Analytics ID option.
Then paste your ID on the provided textbox.
RSS Link - this is for those who don’t want to use Tumblr’s built-in RSS feed. Just type your RSS feed URL link on the textbox provided.
Photoset Post Gutter - spacing between images in Photoset Posts
Facebook Page URL, Pinterest Profile URL, and Twitter Profile URL - URL links of your Facebook page, Pinterest profile, and Twitter profile
Facebook Widget Heading, Pinterest Widget Heading, and Twitter Widget Heading - headings or titles of your Facebook, Pinterest, and Twitter widgets
Disqus Comments
The comments section will show up before the related posts section on permalink pages only if you fill up the Disqus Shortname textbox.
Leave the Comments Heading and Comments Content textboxes blank if you don’t want to display this info.
Social Media Follow Buttons
Scroll down near the bottom of the theme options page of your blog to find the textboxes that correspond to the social media icons that show up on the sidebar.
Then just add the links to your accounts on these sites. For example:
Check out this post for more info.
If you have any questions about any of this, please feel free to ask me by leaving a message in the comments section below or by contacting me here.
How to Customize the Jelana Tumblr Theme Toggle Options?
This post will show you how to customize the toggle options of your blog if you’re using the Jelana Tumblr theme. To get started, go to the theme options page of your blog.
Here are the meanings and explanations for each of these toggle options:
To turn on these features, make sure the toggle switch is colored blue. To turn them off, make sure the toggle switch is colored grey.
Show Menu Links - refers to the entire dropdown box or container which contains the following links:
Submit
RSS feed - refer to the Show RSS link option to show or hide this link
Archive - refer to the Show Archive link option to show or hide this link
Random - refer to the Show Random link option to show or hide this link
The Menu Links show up on the navbar part of your blog, right before the header section. To open the dropdown box containing these links, just click on the burger menu icon (the icon with three horizontal lines).
If you hover your mouse over this icon, you will see a tooltip with the words “Menu Links”. You can customize this text to your liking.
To display the ask and submit pages of your blog, you need to turn on these features on your blog settings:
Use Tumblr RSS - if you want to use Tumblr’s built-in RSS feed, toggle this on.
Show Custom Link - this refers to the custom link that shows up on the navbar part of your blog. You can put any text and link you want here. In the demo blog, the text says Tumblr Themes.
Use Tumblr Fonts - turn this on if you want to use Tumblr’s built-in fonts. Turn this off if you want to use Google Fonts.
Show Caption Titles - this feature makes the first line of Audio, Video, Link, Photo, Panorama, and Photoset posts look like a title. Use this if you want all of your posts to have titles.
For example, if turned on, it can look like this:
If turned off, it will look like this:
Note that the caption titles feature only applies to original posts, not reblogged posts.
Show Exif Data - if available, you can choose to display the exif data of pics from Photo, Photoset, and Panorama posts.
You can turn off this feature if you don’t want to display exif data. If turned on and if available, the exif data will be displayed in the following locations:
Photo post exif data - camera icon on the left side of the pic. Refer to this post for more info
Panorama post exif data: camera icon on the lower right side of the pic. Refer to this post for more info.
Photoset post exif data: i icon on the upper right side of the pic. Refer to this post for more info.
Show Audio Info - this info includes:
Track name
Artist name
Album name
Play count
Toggle this to off if you want to hide this info. Refer to this post for more details.
The Jelana Tumblr theme supports Tumblr’s new Related Posts feature. This will show up on post permalink pages after the comments section and before the footer. Tumblr will be the one to decide which of your posts will show up with this feature.
If turned on and if there are related posts available for your post, you will see a newspaper icon with the text “See more” alongside the post info on permalink pages.
If you hover your mouse over this newspaper icon and accompanying text, you will see a tooltip with the words “Related Posts”.
If you click on this icon, you will automatically be scrolled down to where the related posts are. Alternatively, you can manually scroll down to the related posts section on your own.
Once there, just click the Related Posts heading and the Related Posts section will then show up.
At the end of the related posts section, you will see another button that says “Show more”. If you hover your mouse over this button, you will see a tooltip with the words “See more posts”.
Clicking this button will bring you to the homepage of your blog.
Show Cookie Consent Notice - refer to this post for more info.
Set Your Own Post Font Size - you can choose to set the font size of your blog posts, or you can choose to let the Jelana Tumblr theme automatically set the font size of your blog posts to ensure that all text content will be responsive.
With this toggled to off, the text size and line-height will scale fluidly and will be optimized to ensure readability. Refer to this for more info.
If you think your background image is too dark, and it’s hard to read the text on your blog’s header, toggle the Add Opacity To Background feature on.
The very first pic in this post and the demo blog shows what this looks like. If you turn off this feature, the pic below you shows you what will happen:
Show Footer - the footer shows up at the end of your blog. Toggle this to off to hide the footer section.
Show Tumblr Likes and Show Tumblr Follows - these features are only available on main Tumblr blogs, and only if you have the following settings turned on:
If you’re using the Jelana Tumblr theme, the likes and follows will show up on the sidebar part of your blog.
Show Blog Group Members - refer to this post for more info.
Show Social Icons - refers to the social media follow icons, which shows up on the sidebar part of your blog.
You don’t have to display all of these social media buttons if you don’t want to. For example, if you only want to show the Facebook and Twitter icons, then you can easily hide all the other buttons.
If you hover your mouse over each of these social media icons, you will see a tooltip with the words “Follow me on [insert name of website here]”.
If you have any questions about any of this, please feel free to ask me by leaving a message in the comments section below or by contacting me here.
How to Customize the Jelana Tumblr Theme Appearance Options?
This post will show you how to customize the appearance options of your blog if you’re using the Jelana Tumblr theme. To get started, go to the theme options page of your blog.
Here are the meanings and explanations for each of these appearance options:
Title - the title of your blog. On big screens, this will show up on the left side of the header part of your blog. On smaller screens, it will show up right after the navbar.
To change the color of your blog title, refer to the Title color option.
If you’re using Tumblr Fonts, refer to the Title font option to set the font family of your blog title. The B to the side of the Title font refers to whether you want your blog title to be bolded or not.
Show Title - if you want to hide your blog title, make sure this is toggled to off.
Description - the description of your blog. On big screens, this will show up on the sidebar (on the right side of your blog). On smaller screens, this will show up after the posts section of your blog.
Show Description - toggle this option to off if you want to hide your blog description.
If you want your blog to have a background image, then toggle the Show header image feature on.
To add or upload a background pic to your blog, look for the Header image feature, click on the pencil icon then click on the “Choose a photo” option.
If you click the “Reset” option, the default background pic of your blog will show up. Just click on the camera icon if you want to change this pic.
To display the Avatar of your blog, toggle the Show Avatar feature to on. To upload an avatar to your blog, just click on the pencil icon to the right of the Avatar feature. The Avatar shape can either be square or circle.
On big screens, the Avatar will show up on your blog’s sidebar. On smaller screens, it will show up after the posts section of your blog.
Background Color - use this to change the background color of your blog, not including the header part.
Accent color - the font color of all the links and the background color of all the buttons on your blog.
If you have any questions about any of this, please feel free to ask me by leaving a message in the comments section below or by contacting me here.
How To Customize The Clarent Tumblr Theme 404 Page Not Found?
This post will show you how to customize the error 404 Page Not Found of your blog if you’re using the Clarent Tumblr theme. To get started, go to the theme options page of your blog.
You’ll get an error 404 Page Not Found if the page you were looking for could not be found on your blog.
This could be because the page might have been deleted, you might have been given the wrong URL, the URL link might have been typed incorrectly, or maybe the page never existed.
Tumblr’s default error 404 page looks like this:
Unfortunately, Tumblr does not make it possible to customize this page to your liking. So you can’t change or add anything on this page.
However, with the Clarent Tumblr theme, you can create your own error 404 page and customize this page to your liking.
If you or your blog readers and visitors end up going to a page on your blog that doesn’t exist or that can’t be found, you will all be taken to your customized error 404 page instead of Tumblr’s default one.
To create this, you’ll need to add a page to your blog. To add a page to your blog, scroll down to the bottom of the theme options page then click on the “Add a page” link.
For the Clarent Tumblr theme demo blog, I’ve chosen to use the Standard Layout. But you can also choose to use the Custom Layout. The default is the Standard Layout.
If you click on the downward arrow next to the Standard Layout, a dropdown box or container will show up. From there, you can select the Custom Layout option.
You can put anything you want in your custom error 404 page including images, links to your most popular posts and tags, etc.
You can also check out the Clarent Tumblr theme demo blog’s error 404 page for reference.
Once you’ve created your custom error 404 page, look for the following option:
Type the URL link of your custom error 404 page on the provided textbox.
In the case of the Clarent Tumblr theme demo blog, the URL link of the 404 page is https://clarent-theme.tumblr.com/404, so I typed 404 on the provided textbox.
If you have any questions about any of this, please feel free to ask me by leaving a message in the comments section below or by contacting me here.
You can create a link on the rich text editor before going to the HTML text editor, so all you need to do is add the uk-button and uk-button-primary classes to said link.
How to add links to your blog posts?
On the rich text editor, highlight the text that you want to add a link to
Several circular icons will show up on top of this text
Click on the chain link icon
A textbox with the words “http://” will show up
Type the link you want to add on this textbox
Click the “Done” button that will show up as soon as you type something on the link textbox
How to add links to your blog pages?
On the rich text editor, highlight the text that you want to add a link to
Click on the chain link icon
A dropdown box or container will show up
Type the URL link on the textbox provided
You can choose to add a title to your link - this text will show up when you hover your mouse over said link
You can choose to have this link open in a new window
Click the “Insert link” button to add the link
After adding the links via the rich text editor, you can then go to the HTML text editor then add the aforementioned classes to the links.
The link-turned-button will look like this:
Refer to this post for more info on how to customize the buttons on your blog to your liking. This includes changing the background color and the font color of the buttons. These are global settings, which means your changes will affect all the buttons on your blog.
How to modify the size of the buttons?
Add the uk-button-small or uk-button-large class to a button to make it smaller or larger. This will only affect the buttons or links that have this class.
Add the uk-width-1-1 class to make your button or link span the full width of its container. This will only affect the buttons or links that have this class.
