Tipps zu SEO, Internet Marketing, Webdesign. Magento und IT-Themen

Hier ein Beispiel (Produkt zum Warenkorb hinzufügen) zum absenden eines Form per Ajax Request in Magento:

<script type="text/javascript">
 //<![CDATA[
 var productAddToCartForm = new VarienForm('product_addtocart_form');
 productAddToCartForm.submit = function(product_name) {
 if (this.validator.validate()) {
new Ajax.Request($('product_addtocart_form').action, {
 parameters: Form.serialize($('product_addtocart_form'), true),
 area: $('product_addtocart_form'),
 onComplete: function (transport) { }
 });
}
 }.bind(productAddToCartForm);
 //]]>
</script>

Alternative Code aus dem Newsletter

<script type="text/javascript">
//<![CDATA[
function submitSubscribe() {
 new Ajax.Request('<?php echo Mage::getBaseUrl() ?>newsletter/subscriber/newajax/',
 {
 method:'post',
 parameters: $('newsletter-subscribe').serialize(true),
 onLoading: function(){
 $('subscribe_update_div').show();
 $('subscribe_update_div').innerHTML = "<?php echo $this->__('Sending subcribe request ...'); ?>";
 },
 onSuccess: function(transport){
 var response = transport.responseText.evalJSON();
 $('subscribe_update_div').innerHTML = response.message;
 },
 onFailure: function(){
 $('subscribe_update_div').innerHTML = "<?php echo $this->__('Something went wrong ...'); ?>";
 }
 });
 }
//]]>
</script>

Wenn ihr eine Breadcrumb auf jeder Seite angezeigt haben möchtet, dann könnt ihr das wie folgt über die jeweilige Layout.xml einbinden. Hier ein Beispiel für den Warenkorb aus der checkout.xml:

<checkout_cart_index>
 <reference name="breadcrumbs">
 <action method="addCrumb">
 <crumbName>Home</crumbName>
 <crumbInfo><label>Startseite</label><title>Startseite</title><link>/</link></crumbInfo>
 </action>
 <action method="addCrumb">
 <crumbName>Wkindex</crumbName>
 <crumbInfo><label>Warenkorb</label><title>Warenkorb</title></crumbInfo>
 </action>
 </reference>

Mit den folgenden Eintrag in der .htaccess Datei im Magento Hauptordner könnt ihr ein Geschwindigkeitsschub von 50 – 200% Erreichen (Ladezeit):

AddOutputFilterByType DEFLATE text/html text/plain text/css text/xml application/x-javascript application/x-json application/x-httpd-php
AddOutputFilter DEFLATE html xml css js php
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent

Seit neuesten nervt Google ihre Anwender mit einer Captcha Abfrage bei Suchanfragen. Siehe auch ScreenShot …

Primär kommen diese wenn z.B. über das integrierte firefox-Suchfeld gesucht wird.

Bitte Google hört auf zu nerven sonst wechsel ich noch zu Bing! vergrault Google jetzt so ihre Besucher?

Update 14.07.2010: Google scheint bemerkt zu haben dass sie da etwas zu strikt aggiert haben, heute noch keine Captcha-Abfrage erhalten.

Ihr könnt in Magento ein statischen CMS Block wie folgt im template einbinden.

Ein Beispiel zum einbinden über die entsprechende layout.xml :

<layout>
<asdf_xy_zzz>
<reference name="content">
 <block type="cms/block" name="cms_store_check">
 <action method="setBlockId"><block_id>store_check</block_id></action>
 </block>
 </reference>
 </asdf_xy_zzz>
</layout>

Direkt einbinden im Template:

echo $this->getLayout()->createBlock('cms/block')->setBlockId('your_id')->toHTML();?>

Einbinden im CMS:

{{block type="cms/block" block_id="your_id" template="cms/content.phtml"}}

Im Admin-Backend ist es möglich ein url-key für z.B. Kategorien zu setzen. Möchtet ihr jetzt automatisch von Magento anhand dieser ein Link erzeugen, könnt ihr das wie im folgenden Beispiel:

<a href="<?php echo Mage::getModel('catalog/category')->load(Mage::getModel('catalog/category')->getCollection()->addAttributeToFilter('url_key', 'all-bags')->getAllIds())->getUrl(); ?>" title="All bags" ><?php echo $this->__('All bags'); ?></a>

Ihr möchtet in Prototype ein Ajax-Request nach dem vollständigen Laden der Seite abschicken, habt allerdings kein Zugriff auf den Body-Tag?

Der traditionelle Weg ist den Java-Script-Aufruf vor dem schließenden Body-Tag zu setzen, gelegentlich hat man allerdings nicht immer Zugriff auf diesen, z.B. bei dem Aufruf einer Template-File eines CMS, eCommerce-System oder ähnlich.

Bei Prototype ist es möglich das über den Observe zu machen, z.B. so:

<code>Event.observe(window, 'load', function() {
.. do stuff ..
});</code>

Das Problem ist allerdings dass mit dieser Methode der Anwender warten muss bis das komplette Dokument inkl. aller Bilder und anderen Content geladen ist. Erst dann kann er auf der Seite interagieren. Die meisten Benutzer wollen allerdings nicht warten und gleich mit der Interaktion starten.

Hier ist die Prototype implementation des document.ready mit genauer Erläuterung der Funktionalität.

Hier ein kurzes Beispiel:

<script>
document.observe("dom:loaded", function() {
 myFunction();
 });
</script>

Manchmal ist es ganz hilfreich sich alle verfügbaren Methoden einer Klasse ausgeben zu lassen, das könnt ihr mit der folgenden Funktion:

<style type="text/css">
body { font-family: arial;font-size: 0.9em;}
</style>
<?php
function out_methods($class) {
echo '<p><strong>'.$class.'</strong><br>';
$methods = get_class_methods($class);
sort($methods);
foreach($methods as $k => $v) {
echo "[$k] => $v <br>";
}
echo '</p><hr>';
}
require_once 'app/Mage.php';
out_methods('Mage_Catalog_Model_Product');
out_methods('Mage_Catalog_Model_Category');
?>

Mit diesem Artikel sind wir stolz auf unseren 200. Blog Artikel, 12 Monaten nach dem Start des Blogs.
In den letzten 12 Monaten haben wir im Schnitt 16 Artikel pro Monat veröffentlicht.

Wir danken allen Lesern für Ihre Besuche und freuen uns weiter auf Kommentare & Kritiken zu den Artikeln.

Wir werden Euch auch weiterhin informative Artikel in den Bereich Programmierung, SEO, SEM, Social Media, Internet Marketing, Webdesign, IT, etc.  veröffentlichen.

Übrigens veröffentlichen wir auch gerne Gast-Artikel von Euch! Voraussetzung sind thematisch in diesem Blog passende Themen wie Programmierung, SEO, SEM, Social Media, Internet Marketing, Webdesign, IT, Internet, etc.!

Sucht ihr eine kleinen und einfachen PDF Reader, als Alternative zum Adobe® Acrobat® PDF Reader?

Ich selbst nutze den Foxit Reader, aktuell in Version 4.0! Schlank & Schnell, nicht so überladen wie Acroread von Adobe.