Follow on Twitter
Feed Reader
RSS
Slideshare profile
View ComputersHowtoPro's profile on slideshare
Categories
Follow on Feedly
follow us in feedly
stats

The Blogger platform, operated by internet giant Google, is actually a quite complete blogging solution, and currently millions of bloggers use it to publish anything from poetry to rants to tech news ans gossip, basically, if any topic is decent and useful, you can probably find a .blogspot blog about that topic.
ugly-blogger-subscription-composition

But even though the userbase is huge, given the fact that blogger is mainly used by non-techie bloggers, some very useful functionalities are missing from the platform, and most often a year or more passes before any user  feedback or feature request gets actually turned into a new blogger function.

And and it’s every blogger’s wish to increase the number of people that usually read the blog’s posts, it’s curious, that it is particularly the subscription mechanisms used by blogger, that are lacking almost any semblance of currentness, the simple “subscribe to posts via atom” links and the very few widgets that can be added to a blogger blog, don’t really qualify.

Feedburner, also operated by google, does have a pretty good subscription management mechanism, but it’s often cumbersome to even link the two together, and the “Click to subscribe” option which opens a popup window in which you’ll have to enter an e-mail address, and confirm a captcha, doesn’t really have too many options, it’s just a popup window activated on a click.

The subscription dialog, however, can be made to appear to all NEW visitors to your blog (we don’t want to nag the visitor on every page, with the subscription dialog !), with the help of some simple, straight-forward jquery, some javascript, and some css styling.

The prerequisites:

-you have access to / permissions to edit the template of your blog in blogger.

-you can upload a piece of javascript (downloadable from below this article, have some patience :) ) to a server of your own choosing (any hosting account will do) and call that javascript from your blogger template

-you know your way around in the blogger template, or at least, YOU CAN FOLLOW THE INSTRUCTIONS FROM BELOW, EXACTLY.

Needless to say, before editing your template, go to your blogger dashboard and save a complete copy of your template ! Go to dashboard, click on template (left column menu), and then click on the backup/restore button in the upper-right corner of the dashboard. Proceed to download the template, save it, just in case you mess something up while implementing the subscription popup.

Download this javascript file BY RIGHT-CLICKING the link and selecting “Save link as”, or “Save target as”, depending on what browser you are using. Upload the newly downloaded .js file to an online hosting provider, to the simplest access path possible. So for instance, if your server/online hosting domain is “someserver.com”, make sure you place it in the root folder, so “someserver.com/jquery.cookies.js” will be accessible in a webbrowser.

Next, go to your feedburner account, and note down your feedburner USER name for your feed. Go to “edit feed details”, and in the edit field, whatever text string comes after “feeds.feedburner.com/”, that is your username for that feed. (For “feeds.feedburner.com/someblog”, “someblog” is the username).

Now go to your blogger template. Click on “Edit html”. Click anywhere inside the template editor window first. Press CTRL+F to bring up the search/find input box inside that window. Click inside the find dialog, and type exactly this (without the quotes) : “</b:skin”.

Hopefully, the editor will jump to the collapsed section of <b:skin>….</b:skin> in your template. Click on the leftmost arrow in that row, to expand that section. Now press CTRL+G to jump to the </b:skin part of the expanded section.

Click above the </b:skin>, press enter a few times (so that you create space for the next lines to be entered, and some space around it – it’s easier to see the code that way).

Copy and paste the following CSS code, exactly as it is:

#dialog
{
background-color:white;
visibilty:hidden;
display:none;
padding:20px;
margin:10px;
width:340px;
height:200px;
border-radius:3px;
-moz-border-radius:3px;
-moz-box-shadow: 2px 2px 2px #111111;
-webkit-box-shadow: 2px 2px 2px #111111;
box-shadow: 2px 2px 2px #111111;
vertical-align:middle;
font:$(body.font);
}

#dialog img { position:relative; top:10px; }
.ui-dialog-titlebar-close
{
position:absolute;
top:90%;
left:42%;
}

Obviously, if you know your way around the template, and have a good understanding of CSS, HTML, javascript, jquery, etc., you are welcome to style the elements as you please. This is just a simple example styling, with simple white background, and nothing too fancy :)

Now, save your template, but don’t leave the editor window just yet.

Click inside the editor window anywhere, and then press CTRL+F again. The search/input box in the upper-right corner will be cleared.

Type this in the box, and press enter (without the quotes) :

“</body”

This will hopefully take you to the part in the template, where the HTML part actually ends. Again, press enter a few times before that line, so you’ll have easier visibility for the code you’re about to enter before it.

First, we have to call the three jquery scripts that will allow us to load a dialog. Copy/paste the following lines exactly as they appear here:

<script src=’http://code.jquery.com/jquery-latest.min.js’/>
<script src=”//code.jquery.com/ui/1.11.3/jquery-ui.js”/>
<script src=”//xtart.eu/jquery.cookie.js”/>

In the third line, PLEASE REPLACE xtart.eu  with the address of your own server, where you’ve uploaded the jquery.cookie.js If you don’t have a hosting account, you are welcome to try using it hosted on my server, but please be aware that it’s only a shared hosting server, and it’s NOT intended to be accessed, except for download, and maybe a few hundred tests, from there !

The cookie.js will allow the page to set a cookie, on the first visit, in every visitor’s browser, in order to make sure that the dialog box is not loaded if it has already been loaded once !

Now, the following part of the script, actually loads the dialog. Again, copy and paste the following script, as it appears, after the previously inserted lines and before the  </body> tag.

<script>
if ($.cookie(‘test_status’) != ‘1’)
{
setTimeout(function() {
$(function() {
$( “#dialog” ).dialog();
});
}, 5000);
$.cookie(‘test_status’, ‘1’, { expires: 30 });
}
</script>

Even if you don’t really have an understanding of jquery or javascript, this script obviously just checks if the cookie has been set, and if it has not been set (it’s the firs visit), then waits for five seconds after the first page has loaded, and pops up the subscription window.

Now, from the next piece of code, replace IN ALL THREE PLACES, the string “YOURFEEDBURNERUSERNAME”, with your actual feedburner user name, which you’ve hopefully copied as indicated at the top of this article.

Copy and paste the following code, after the previously inserted lines, in your template, before the ending </body> tag.

<div id=”dialog” title=””>
Join our <img src=”http://feeds.feedburner.com/~fc/YOURFEEDBURNERUSERNAME?bg=99CCFF&amp;fg=444444&amp;anim=0″ height=”26″ width=”88″ style=”border:0″ alt=”” /> and subscribe to this blog !<br/>
<form id=’feedburner’ style=”border:1px solid #ccc;padding:3px;text-align:center;” action=”https://feedburner.google.com/fb/a/mailverify” method=”post” target=”popupwindow” onsubmit=”window.open(‘https://feedburner.google.com/fb/a/mailverify?uri=YOURFEEDBURNERUSERNAME’, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520′);return true”><p>Enter your email address:</p><p><input type=”text” style=”width:140px” name=”email”/></p><input type=”hidden” value=”YOURFEEDBURNERUSERNAME” name=”uri”/><input type=”hidden” name=”loc” value=”en_US”/><input type=”submit” value=”Subscribe” /><p>Delivered by <a href=”https://feedburner.google.com” target=”_blank”>FeedBurner</a></p></form>
</div>

Save your template, and hopefully, from now on, every visitor that has not yet had the specific subscription cookie set, will be greated 5 seconds into the page, by the subscribe dialog box. You are of course, welcome, to change the dialog’s content, add other content to it if you wish, just make sure that you also adapt the css styling in the <b:skin> portion of your template, to accomodate the changes.

You can test the dialog / subscription popup on my romanian IT blog (be warned, it’s in Romanian … but it does demonstrate that the popup is working as expected, and only appears on first visit).

Did you succeed in implementing the dialog box ? Did you meet any difficulties implementing it ? Was it hard ? Do you find it useful ? Please let me know in the comments (preferably in the facebook comment box), under the article, and I’ll do my best to get back to you as soon as possible.

Oh, and please share this article with your friend, my blog, just like yours, likes its visitors :)

Thank you !

I always wonder how is it that a perfectly working, useful program with a nice, tidy interface,  made by a small, noname company starts becoming a shiny, error-prone, useless piece of bloatware after big, hotshot companies buy the product or the entire company that used to make it.

Image of skype 7 error

Skype is becoming more and more a shiny piece of error-loaded bloatware

And I wonder why the hell do programmers that work on skype these days do even get paid (I presume, they do get paid), because since Microsoft took the damn thing over, the quality of the entire skype experience just got worse and worse.

What is wrong with these people, seriously, they took a perfectly working program and turned it into a useless piece of good looking crap. Constantly nagging me to update (my latest version was 6.21 something), well, I finally decided to upgrade to version 7. “Newer, better and improved”. Someone should beat the living crap out of the idiots who work on skype and think that if they’ve improved the visual appeal of a program they’ve actually made an improvement.

What the hell is this new trend all over the net with programmers these days (chrome/chromium, flash, firefox, almost all linux version, ANY digital product), they all just make shiny tweaks with regard to the looks here and there, and the products get worse and worse as time goes by ?

Here’s skype’s example : after the upgrade, every third or so click ANYWHERE on the skype interface gives out an error message and the damn “home screen” can’t be turned off.

What the hell is wrong with these people, seriously, where have they learned to program, in the dumpster behind there grandma’s bar where they get wasted on pot every day ? (if they have learned at all)

Very, very sad…

I guess it’s just the result of the fact that people like Marissa Mayer and Steve Ballmer only hire people with astounding resumes who have no clue how to continue the work done on skype before them, work done by people who didn’t have these assholes degrees but instead had KNOWLEDGE and KNOW-HOW.

 

Yahoo mail is inaccessible from Firefox, because of it’s invalid/expired security certificate.

Very nice, yahoo, keep up this path and you’ll end up with a worse version of your mail service then you had 10 years ago…. Oh, wait, it’s already worse !

Yahoo mail's security certificate is expired

Yahoo mail’s security certificate is expired

 

(Click on the image for a higher resolution)

Screenshot was taken on Saturday, January 10, 2015, the time is visible in the screenshot

 

dirty-amilo-heatsink

TL;dr : check these, if you think your customer’s pc is clogged ;

Some of the regular challenges of being an IT support person are listening to heavy cursing, accepting some foul language from your customer knowing that it’s directed towards “that damn machine” and not you, and from time to time, cleaning a PC that has more dust and spiderweb in it, then your grandfather’s shack in the woods :)

So, when the “computer won’t work”… you might want to check inside the case to see if some of things you’ll see in the pictures here, don’t also apply to your case :)

I doubt that any computer or laptop will work well with a clogged heatsink and / or a clogged cooler as these in the pictures, for that matter.

Read the rest of this entry »

I sometimes wonder how is it even possible, that software and service giants like google, yahoo, microsoft, and other companies their size can even exist in a technology world presumably dominated by pure, hard-core mathematics, and yet, fail to respect even the simplest arithmetic rules, such as 2+2=4. Blogger now “thinks” that math should not apply to its calculations.

Read the rest of this entry »