Get Blogged by JoKi

"The only frontiers are in your mind"
10 | 03 | 2010
Navigation
Syndication
feed-image RSS 2.0
Most Read Articles
Related Resources
Article Time Line
Visitors
Validation

Valid XHTML 1.0 Transitional
Valid CSS!

Spacer for layout formatting
Get Blogged by JoKi

Jochen Kirstaetter (2008)

The only frontiers are in your mind, welcome to my blog sphere. Your host is Jochen Kirstätter aka JoKi.

Dive into the weird world of a professional software developer and follow his daily victories and struggles with modern technology. I am a Microsoft Certified Professional (MCP) for Visual FoxPro, was Microsoft Most Valuable Professional (MVP) for Visual FoxPro in 2006 and 2007, and from spring 2004 until end of 2006 I organized monthly user group meetings as regional director of German FoxPro User Group (dFPUG). Based on this community activities I am also member of Microsoft Community Leader/Insider Program (CLIP) and PASS Deutschland e.V.

This blog is also about the beautiful island of Mauritius, my home.

Sincerely, JoKi



AddThis and Google Analytics : Asynchronous Tracking Code Integration PDF
User Rating: / 1
PoorBest 
Community
Wednesday, 03 March 2010 12:41

During the weekend I did some modifications, read improvements, here on the website according to Search Engine Optimization (SEO), keywords and page load times. Reducing the page load times made it necessarily to arrange my Javascript snippets in the template. So far, everything went well, until I figured out that my Google Analytics dropped down to 0...

So, while checking those issues I stumbled upon the 'new' Google Analytics Asynchronous Tracking code. This will also reduce page load time as "asynchronous tracking optimizes how browsers load ga.js so its impact on user experience is minimized." - Great!

The steps to use the asynchronous tracking is straight forward:

  • Memorize or copy your web property ID from the existing snippet
  • Remove the synchronous tracking code
  • Insert the asynchronous tracking code
    <script type="text/javascript"><!--
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-XXXXX-X']);
    _gaq.push(['_trackPageview']);

    (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ga);
    })();
    // --></script>
  • Replacing UA-XXXXX-X with your web property ID.

That's the easy part...

Integrating AddThis into the 'standard' Google Analytics is extensively described on the help pages of AddThis. But sadly, there is no information about the asynchronous tracking code. Additionally, I checked the AddThis support forum and the topic 'Google Analytics : Asynchronous Tracking Code Integration' is discussed since a while. Not even answered by AddThis supporters yet. Even the Google Forum does not provide an answer. I was astonished to see this! Frankly speaking, this is not an unusual situation for a website, or?

Anyways, back to this article. You can send AddThis shares to your Google Analytics reports as custom events in the category “addthis” by adding the following configuration code to your existing AddThis sharing code:

addthis_config = {
data_ga_tracker
: pageTracker
}

The main problem about the interoperability between AddThis and Google Analytics is that the asynchronous tracking code does not provide a pageTracker object anymore. As said, this only works with the synchronous tracking code of Google Analytics. The forum threads actually provides some directions towards the solution of this problem. The link between those two services is to reference the GA pageTracker object in the AddThis configuration.

The Asynchronous Tracking Usage Guide provides the necessary information in the paragraphs about Multiple Tracker Objects and Pushing Functions. It is not clearly described on the spot but with a little bit of logic you can figure it out: Create your own Javascript variable that queries the Google API.

_gaq.push(function() {
var pageTracker = _gaq._getAsyncTracker('myTracker');
var link = document.getElementById('my-link-id');
link
.href = pageTracker._getLinkerUrl('http://example.com/');
});
<

The solution lies in the parameter of _getAsyncTracker(). The samples in the User Guide refer to a named tracker. But what about the initial one? Right, just specify an empty string and you are done!

To summarize this article just use the following code snippet at the very end of your website to integrate Google Analytics : Asynchronous Tracking with your AddThis analytics:

<!-- Google Analytics and AddThis button -->
<script type="text/javascript">
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ga);
})();
</script>

<script type="text/javascript">
var pageTracker = _gaq._getAsyncTracker('');
var addthis_config = {
data_ga_tracker: pageTracker
};</script>
</body>

The GA user guide recommends to split your asynchronous code over your HTML content. The setup of the tracker should be directly after the <body> tag whereas the rest should be placed at the very end of your document (as described above).

Hopefully, my description is clear enough to enjoy a smooth and seamless code integration between Google Analytics Asynchronous Tracking and AddThis Sharing.

 
Modified Ultimate Paypal Donations Module PDF
Development
Wednesday, 17 February 2010 20:00

The article describes some opinions and modifications for a Joomla! extension called Ultimate Paypal Donations Module by JoomlaSpan.

First of all I have to say that using this extension to provide any kind of PayPal donation element on your site is really easy and straight forward. You just install it, setup your parameters and mdoule location and you are done. It could not be better...

Well, it could.

Actually, my main problem with this module is about XHTML 1.0 compliance. Sadly to see that the current version (as of writing this article) does not follow the W3C rules about XHTML 1.0. Luckily, the necessary changes are very simple to realize by modfying one PHP file. Following is the modified version:

<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="cmd" value="_donations" />
<input type="hidden" name="business" value="<?php echo $paypal_emailID; ?>" />
<input type="hidden" name="item_name" value="<?php echo $item_name; ?>" />
<?php if ($item_number)
{
echo "<input type=\"hidden\" name=\"item_number\" value=\"" . $item_number . "\" />\r\n";
}
?>
<?php if ($amount)
{
echo "<input type=\"hidden\" name=\"amount\" value=\"" . $amount . "\" />\r\n";
echo "<input type=\"hidden\" name=\"lc\" value=\"" . $location . "\" />\r\n";
}
?>
<input type="hidden" name="no_shipping" value="0" />
<input type="hidden" name="no_note" value="1" />
<input type="hidden" name="currency_code" value="<?php echo $currency_code; ?>" />
<input type="hidden" name="tax" value="0" />
<input type="hidden" name="bn" value="PP-DonationsBF" />
<?php if ($image_choice==1)
{
echo "<input type=\"image\" border=\"0\" src=\"" . $donate_image . "\" name=\"submit\"
alt=\"PayPal - The safer, easier way to pay online!\" />\r\n";
}else{
echo "<input type=\"image\" border=\"0\" src=\"" . $own_donate_image . "\" name=\"submit\"
alt=\"PayPal - The safer, easier way to pay online!\" />\r\n";
}
?>
</form>

Modified version of mod_paypal-j15/tmpl/default.php

Despite the tooltip description about choosing your own PayPal button for this module you do not need to specify the full URL including http:// prefix. As you can see in the PHP code any relative path is working too. For reduced number of DNS lookups you should get your preferred PayPal button on your server and change the module to use your 'own' image.

In my changes above you also see a marked if-statement in the code. Well, in the original code there are two identical statements, I just merged them together for better reading.

Add last but not least, I removed the border attribute from input tags that displays the PayPal image on your site. Style information like border attributes belong to CSS files and should not be part of the HTML code.

 
Finally tweeting PDF
Community
Monday, 08 February 2010 07:46

Finally, I could convince myself to register an account on Twitter to start micro-blogging. The registration is free, easy and straight forward. No woes at all...

I could have set up a tweet already ages ago but honestly I have to say that I never had any real motivation about this whole concept. Even now, I am not 100% sure about the pros and benefits of Twitter are. Maybe I will get some feedback on this during the next weeks. Perhaps I might use this micro-blogging space for some more questions or even rants... Let's see. ;)

Anyways, the "Get in contact" area in the sidebar is updated and you might follow my tweet on this URL: http://www.twitter.com/JKirstaetter

Sadly, my alias "JoKi" is alerady in use by someone else, but that's life: First come, first serve.

One of the next things I am going to do is to check out of one the many Codeplex projects, namely VFPTweetAPI by Olaf Doschke. First of all, it is to get more familiar with Twitter itself and second I hope that it is easier to tweet from VFP directly than to launch my favorite browser. And last but not least, I might integrate the component into one of my projects like Sunshine.

Definetily more on this topic in the future...

 
Modified HP Router PDF
Development
Saturday, 30 January 2010 15:17

While looking for some improvements of Joomla! native SEF engine I found the following extension quite interesting and easy to use: HP Router of Hannes Papenberg. Installation is straight forward and no struggles at all. For best results you might install this extension before starting any kind of search engine optimization for your website.

But after a short time I was confronted with some 'nasty' behaviour in my website that was introduced by this extension. Some articles did not show up properly and ended in an HTTP 404 error message. Well, actually reading the description of HP Router gave me an idea of the problem:

ATTENTION!! There are a few things you have to keep in mind with this plugin:
1. You can't have the same alias for two articles, even though they are in different categories. To be precise, you can't have the same alias for any type of content item. As a rule of thumb: If you can get to the list of this type of content items from the administrator menu, you can't use the same alias on two items in that list.

My 404 problem is directly caused by duplicated aliases... but not the obvious way!

The reason here is that the extension (as of writing this article) does not respect the state of the articles in the Joomla! CMS. And due to migration processing from previous blog databases I had a bunch of duplicated topics but deleted. This refers to state -2 instead of published content that has a state of 1.

To correct this problem it is necessary to modify two PHP files of the original HP Router:

  • hprouter/com_contentrouter.php
  • hprouter/com_contactrouter.php

Almost of the end of each file there are the SQL statements to query the database. After you made a backup of your two files you should change them like so:

$db =& JFactory::getDBO();
if($vars['view'] == 'article')
{
$query = 'SELECT id FROM #__content WHERE state = 1 AND alias = '.$db->Quote($vars['id']);
} elseif($vars['view'] == 'category') {

Modified version of hprouter/com_contentrouter.php

$db =& JFactory::getDBO();
$query = 'SELECT id FROM #__contact_details WHERE state = 1 AND alias = '.$db->Quote($vars['id']);

Modified version of hprouter/com_contactrouter.php

With those modifications the HP Router works as expected and queries only published articles. Currently, I am not using the archive state of articles but in case that you will, just extend those two queries to include the necessary state values.

 
Modified Mod LCA PDF
Development
Saturday, 23 January 2010 16:06

Joomla! content management system (CMS) is great for websites of any type in general. Even using the system as a blog software is quite easy to configure. Instead of the classical Frontpage Layout as default you configure the system to use one of the available Blog Layouts as default page. Then some tweaks according to leading articles, columns, etc. and you are almost done. Almost...

One of the great features that I like with blog application is the ability to display an Archive list of existing articles based on their creation date. Well, Joomla!s own archive functionality works in a similar way but sadly I experienced own mayor drawback: Archived articles are not part of the internal search engine anymore and therefore results are not displayed.

After my usual online research I found a recently added Joomla! extension called Mod LCA of JoniJnm. The description gives the direct motivation / link to other blog applications:

Mod LCA shows articles sorted by year and month, such as wordpress or blogspot

The module itself is really easy to install and works as expected. Almost...

In case that your content is created the usual way, Mod LCA is just fine. But in my special case I did some direct data migrations via SQL statements from my previous blog software and therefore my sequence of itemids differs from the original creation date of an article. It was quite funny to see that an article of June 2006 was listed in December 2009 by Mod LCA. But hey, when does it happen that the ID and the creation date are controversal? Not quite often but it can happen like in case.

Alright, having a look at the source code files of Mod LCA gives a direct glue about how we can improve the situation. At least, it's nothing complicated but the correct order clause of a SQL statement, or? And there we go...

Before any modifications be aware to have a backup at hand. Open the file mod_lca/helper.php with your favourite text editor and change the query statement like so:

$query = 'SELECT a.id, a.title, a.alias, a.catid, a.sectionid, c.alias as calias, '.
$created.
' FROM #__content AS a'.
' LEFT JOIN #__categories AS c ON c.id=a.catid'.
' LEFT JOIN #__sections AS s ON s.id=a.sectionid'.
' WHERE ( a.state = 1 AND s.id > 0 )' .
' AND ( a.publish_up = '.$db->Quote($nullDate).' OR a.publish_up <= '.$db->Quote($now).' )'.
' AND ( a.publish_down = '.$db->Quote($nullDate).' OR a.publish_down >= '.$db->Quote($now).' )'.
' AND s.published = 1'.
' AND c.published = 1'.
' ORDER BY a.created DESC';
$db->setQuery($query);

... some lines down ...

$out[$d[0]][$month][] = '<a href="'.$link.'">'.htmlspecialchars($row->title).'</a>';

Modified code of mod_lca/helper.php

The original code orders the result set by a.id and this might cause problems. With this minor code change articles are queried in the expected order and as a consequence in my case my 'Article Time Line' in the sidebar is properly rendered and displayed.

After running some validation tests according to XHTML 1.0 compliance I did some more modifications to mod_lca. By adding the PHP function htmlspecialchars() to encode the output of the article title you will get properly encoded special characters in your hyperlinks. This modification has to be done in the helper.php file as you can see above.

To create the tree hierarchy of the article list based on year and month, mod_lca needs some CSS and JavaScript instructions. Well, for the JavaScript it is not a problem itself but the CSS styles should not be placed with the <body> tag of the rendered page. To improve this situation it is necessary to tidy some code of mod_lca.

if (!DEFINED("LCA_HEADER")) {
// If cache is enabled, we can't add css neither js files

define("LCA_HEADER", 1);
echo '
(<style> section deleted)
<script type="text/javascript">

Modified code of mod_lca/tmpl/default.php

The key of this solution is to move the style information away from the module and into the template CSS file or if you prefer in its own CSS file. To reduce the number of HTTP requests the styles should be in the template.css file.

/********
mod_LCA
********/
li.lca {
display: block
}
ul.lca {
padding: 0px
}
span.lca {
cursor: pointer
}

Modified CSS code of template.css

The consequence of those slight modifications is that XHTML validation of my site produces roughly 30 errors less than before. Depending on your content this may vary, of course... ;-)

 
« StartPrev12345678910NextEnd »

Page 1 of 56
Spacer for layout formatting
About me
Microsoft Most Valuable Professional 2007 & 2008

Microsoft Certified Professional

Get in contact

Follow Jochen Kirstaetter (JoKi) on Twitter JoKi @ ICQ JoKi @ Skype


Recent books

  • MCTS 70-536 - .NET Framework 2.0 Application Development Foundation
  • Code-Centric: T-SQL Programming with Stored Procedures and Triggers
  • Microsoft .NET Framework-Programmierung in C#

Community

deutschsprachige FoxPro User Group

Microsoft Community Leader/Insider Program

International .NET Association

O'Reilly Verlag
Sponsoring
If you like the information on these pages, your support is highly appreciated.
Thank you very much!