If you want to learn how to secure your blog posts, and pages so nobody can copy it or even select the text, then follow along the instructions given below and you’ll be able to secure all your blog posts at once.
The following technique best applies to CSS style sheets if you have a blog that is designed with a parent and child themes with the use of a framework like Genesis. Nevertheless, even if you have a Blogger Blogspot blog, this should still work seamlessly.
Problem: You want to adjust the width of your content area or the sidebar for your child theme but don’t know how.
You’ve come to the right place. Just sit back and read till the end and let me know if this helped you or if you have any questions.
First, let’s find the area on your blog which needs the adjustment. You can accomplish this by ‘Inspecting’ your page elements using Google Chrome’s Inspect Element option. (Friendly Note: Firefox fans – please use Firebug extension to do this exercise).
Go to your blog.
Right click on the area that needs alteration/adjustment.
Select ‘Inspect Element’.
Let me show you an example:
For my blog – thekeyponderer.com I wanted to increase my sidebar width by a little more pixels so I can easily fit in some of my widgets. So I right click on my sidebar in the blog.
If you notice the CSS styles section in the screenshot, my sidebar had a width of 270 pixels.
Now, I want to increase my width to 280 pixels so that I know I can fit in a particular widget that doesn’t fit in its current 270 pixel-wide sidebar.
So, I go to my WordPress > Appearances > Editor and start editing my style.css file.
Since, I want to edit my sidebar section I will search for .sidebar { as seen in my STYLES section. .sidebar { display: inline; float: right; font-size: 13px; line-height: 20px; width: 270px; }
I simply take a backup (copy/paste to a Notepad file) of my existing style.css code, then replace the width: 270px;with width: 280px;
Save and update the style.css file.
After I refresh my webpage, Voila! the sidebar width is now increased by 10 pixels; from 270px to 280px.
Changing the content width or any other area of your webpage is also similar. Just follow the steps given above.
I used Nomadic Child Theme for this above example and obviously, I use Genesis Framework. (Psst…I recommend this Framework strongly – one of the best and its the Industry standard in my humble opinion).
Hope this helped you in changing the content width or sidebar width for your blog. If it did, let me know and share your happiness with me below via comments.
Have questions, just shoot! I will do my best in helping you out.
Host images or any file on Dropbox and reduce your blog’s loading time
This process also saves you storage space on your precious hosting account, by hosting static files. But please remember that Dropbox cannot act as a CDN in the long run and you might inevitably find yourself looking for a regular CDN someday. Till then, and up to a point you want to scale up to that level, you may use Dropbox as the CDN.
Get your Dropbox from here – this special referral link gives additional FREE 500MB storage!
WordPress: Create Sticky Menu That Stays On Top When Scrolling Using CSS
This post is a little techy which involves working with code in WordPress > Appearance > Editor section. In particular, the menu items can be found in style.css file which can be fixed on scrolling.
If you don’t want to worry by coding or making changes to your WordPress themes, just check out the various plugins that are available in the WordPress market which does this job.
For those who want to fidget with the codes to create fixed menu when scrolling page, continue reading:
1. Go to your website as it is now. Right click on the menu you want to float while scrolling. Click on Inspect Element.
2. The name for your menu depends on which theme you use. It will mostly be named appropriately – ‘#navbar‘ or ‘#menu‘ or ‘#mainmenu‘ or ‘#subnav’. In this example, it’s named as ‘subnav‘. Expand this line by clicking on the small triangle icon to see all your menu items listed.
3. Now search this ‘subnav‘ in your style.css file. It’s better to take a backup of this file by copy-pasting the style.css contents to a Notepad file.
4. Find the attribute that says position: relative; and change it to position: fixed; you can also add other attributes like width, right, top, left depending on your preference to position your sticky item. Just check this w3.org article to know and read further.
5. Save. Exit. Refresh your webpage and you’ll notice that the menu bar sticks on top when you scroll down. I have Genesis Framework installed, so I had an option to install a custom plugin to do this job. However, following the above steps will help you accomplish the same tasks without installing any plugin.
Alternatively, jQuery also comes to rescue and you can find more details in this post and this post.
What other ways do you know to keep menu stick on top floating while scrolling? Let us know using the comments box below.
I attempted to put my solo-brainstorm at work and the result is this post.
Hope you find this solo brainstorm about rel=”nofollow” useful.
What is a rel=”nofollow” attribute?
A rel=”nofollow” attribute, in layman’s terms is, simply asking search engines not to follow a link that you’ve given in your blog post. Every webpage acquires certain PageRank in terms of Google search and crawl analysis, which gets passed and shared on to other links if you add them to your blog. This is also sometimes referred to as SEO juice. If you don’t want your SEO juice to freely pass on to other websites that are not worth it, you can simply add rel=”nofollow” attribute to that hyperlink.
When to use rel=”nofollow” attribute?
If you feel that you want to add a hyperlink to a website that you know for sure is good for nothing to your readers, then simply add a rel=”nofollow” attribute.
What is a ‘dofollow’ attribute?
‘Dofollow’ attribute is just the opposite of rel=”nofollow”. In fact, the absence of rel=”nofollow” attribute is a ‘dofollow’ attribute. There is no need to add a dofollow attribute specifically to a URL.
What does Matt Cutts, the head of Web Spam team, has to say about rel=”nofollow”?
As per Matt Cutts, one can add rel=”nofollow” to specific links. Read more here.
What do we gain by adding this attribute value?
We actually are passing our good karma by NOT adding rel=”nofollow” attribute to our links. Thus, one must ensure that the good karma passes on only to deserving websites that are really useful to people. If not, just remember to add rel=”nofollow” tag.
Apart from the Karma metaphor, you can also see it as a positive vote. Because, just like you, there could be many linking to a particular website. This is nothing but positive vote for that target link – which increases its value in turn – because Google thinks that if many people are linking to a website, then that has to be a good one.
What do we lose by adding this attribute value?
Nothing. By adding this tag, we lose nothing. In fact, this helps us in fighting web spam in our own small way – if you look at the larger scheme of things.
Will this increase my PageRank?
Adding ‘nofollow’ attribute actually doesn’t pass any PageRank juice to the target link that you’d added.
What kinds of links should be marked as rel=”nofollow”?
Any link that you feel is not a good resource for your blog reader.
Is there a way to automate the rel=”nofollow” addition to my URLs using any plugin?
There are many plugins available in WordPress plugins database that you can search and use the one you like. However, there are a couple of plugins I recommend and love. They are:
