Piwik Besucherzahlen auf der Pebble mit „Cards“

Da es im Pebble Store leider keine Watchface gibt, die einem die Besucherzahlen von Piwik auf der Uhr darstellt heißt es selber bauen. Es gibt verschiedene Apps für die Pebble die Inhalte vom eigenen Server anzeigen können. Optisch gefällt mir Cards for Pebble am Besten, daher mal das Tutorial an diesem Beispiel.

Piwik auf der Pebble
Erste Zeile: Abkürzung der Website, Uhrzeit letzter Aktualisierung
Zweite Zeile: Besucher Heute (Impressionen Heute)
Dritte Zeile: Besucher Gestern (Impressionen Gestern)

 

Die Umsetzung ist recht einfach, man erstellt eine PHP Datei auf seinem Server die die Piwik Daten verarbeitet und einen JSON für Cards ausgibt. Mein Script ist recht Simpel gehalten und sieht folgendermaßen aus:

 

<?php
$site_id = 5;
$api_key = 'dbjkbjioajioajjbdkljbklj';
$piwik_url = 'http://piwik.schnipsellager.de/'; // ohne index.php! , ohne Slash am Ende

$file = file_get_contents($piwik_url.'/index.php?module=API&method=VisitsSummary.get&idSite='.$site_id.'&period=day&date=today&format=JSON&token_auth='.$api_key.'');

$today = json_decode($file);

$file = file_get_contents($piwik_url.'/index.php?module=API&method=VisitsSummary.get&idSite='.$site_id.'&period=day&date=yesterday&format=JSON&token_auth='.$api_key.'');

$yesterday = json_decode($file);

$ret = array();
$ret['content'] = "SL            ".date('H:i')."\n";
$ret['content'].= "H:     ".fill($today->nb_visits).$today->nb_actions."\n";
$ret['content'].= "G:     ".fill($yesterday->nb_visits).$yesterday->nb_actions."";
$ret['refresh_frequency'] = 30;

// Array in JSON Wandeln und ausgeben
echo json_encode($ret);

function fill($var) {
    $len = 9;
    $newlen = $len = $len - strlen($var);
    return str_pad($var, $newlen); 
}

 

Das Script holt sich von euer Piwik Installation die Informationen zu den Besuchern von Heute und Gestern. Dann wird der JSON in ein Array geparst und wir setzen und ein Return Array zusammen. Der erstellte JSON besteht lediglich aus „content“ und „refresh_frequency“. Content beinhaltet alles was auf der Pebble später angezeigt wird, refresh_frequency bestimmt die Aktualisierungsrate in Minuten.

Die Formatierung ist einfach gehalten: Durch Leerzeichen kann man sich die Zeilen auf dem kleinen Display in die richtige Position rücken. Mit STR_PAD werden die Besucher des aktuellen Tages auf Mind. 5 Zeichen aufgefüllt.

 

 

SiteID ? API Key?

Die SiteID findet ihr einfach in der Adresszeile wenn ihr die Berichte einer Website anschaut: index.php?module=CoreHome&action=index&idSite=5

Für den API Key klickt oben auf Admin (oder euren Username) und anschließend Links auf API. Jetzt seht ihr einen Eintrag mit Token Auth, da kopiert ihr euch alles fett makierte.

piwikapi7

 

Wie richte ich Cards ein?

Screenshot_2015-08-30-16-40-08Cards for Pebble ist schnell eingerichtet. Kurz im Pebble Store installieren und in der anschließenden Einstellungsmaske unten auf Custom klicken. Ihr müsst nun nur die URL ändern und ab sofort habt ihr die Besucherzahlen eurer Website immer am Handgelenk.

 

Unterschied zwischen $(document).ready() und $(window).load()

Mit Jquery hat man die Möglichkeit Aktionen erst auszuführen, nachdem der DOM (Document Object Model) vollständig geladen ist. Ab diesem Zeitpunkt weiß der Browser welche DIVs und Elemente vorhanden sind. Zusätzliche Inhalte wie Grafiken etc sind jedoch noch nicht vorhanden, daher kann z.B. auch eine Höhe von einem Div unter Umständen noch nicht exakt ausgelesen werden.

$(document).ready(function(){
 // mein code
});

 

Was macht dann $(window).load()?

Mit $(window).load() hat man die Möglichkeit seine Funktionen erst dann zu starten wenn das Dokument mit allen weiteren Inhalten geladen wurde. Eignet sich beispielsweise wenn man die Höhe eines DIVS auslesen muss, nachdem dort dynamischer Inhalt eingefügt wurde.

$(window).load(function(){
  // mein Code
});

PHP: Facebook Likes / Fans einer Seite auslesen

Wollt ihr die Anzahl von Facebook Fans automatisiert auslesen, so besteht die Möglichkeit das einfach über die Facbeook Api zu lösen.

<?php 
$fb_siteid = '101023253399';
$json = file_get_contents('http://api.facebook.com/method/fql.query?format=json&query=select+fan_count+from+page+where+page_id='.$fb_siteid.''); 
$response = json_decode($json); 
echo 'Facebook Fans: '. $response[0]->fan_count;
?>

 
Für die Abfrage braucht ihr die Site ID. Diese bekommt ihr recht einfach raus. Klickt einfach auf das Profilbild und schaut euch die URL in der Adresszeile genau an. Irgendwo steht eine lange Zahlenfolge die durch Punkte seprariert ist. Der Letzte Block vor dem Slash ist die SiteID.

Hier mal ein Screenshot am Beispiel von GoogleWatchBlog.de:

gwb-facebookid

PHP: Copyright mit automatischer Jahreszahl

Immerwieder schön ist es im Footer zu lesen: © by Firma 1997 bis 2012. 

Liest sich so, als wenn die Firma 2012 eingestellt wurde, ist jedoch meistens einfach die letzte Aktualisierung der Website gewesen.

Um diesen Fauxpas zu vermeiden sollte man hier einfach mit Date das aktuelle Jahr generieren, dann kann man auch nie wieder vergessen alljährlich die Jahreszahl zu editieren.

&copy by schnipsellager.de 1954 bis <?php echo date('Y'); ?>

WordPress: Kategorie aus Feed ausschließen

Wenn du im Feed bestimmte Kategorien nicht haben möchtest, so kannst du dir entweder unzählige Plugins installieren oder einfach einen Schnipsel in deine Functions.php einfügen.

Die Vorgehensweise ist eigentlich recht einfach, es wird ein Filter für die allgemeine Query pre_get_posts Funktion gesetzt. Dort wird geprüft ob gerade ein Feed ausgegeben wird. Ist dem so, dann wird die Kategorie mit der ID 5 ausgeschlossen.


function sl_exclude_from_feed($query) {
    if ($query->is_feed) {
        $query->set('cat','-5'); 
    }
return $query;
}

add_filter('pre_get_posts','sl_exclude_from_feed');

Das ganze funktioniert auch wunderbar wenn man aus der Suche eine Kategorie ausschließen möchte.

CSS: Link beim Mouseover animiert unterstreichen

Wem das normale Underline zu langweilig ist für seine Links, der kann das Ganze auch etwas verspielter machen. Z.b das Unterstreichen von links nach rechts zu animieren.

Wichtig ist, dass das a-Element ein Text-decoration: none bekommt um eine automatische Unterstreichung zu vermeiden. Dann sollte man dem Element ein Position: relative verpassen, da wir unsere Linie absolut unter dem Element platzieren.

 

DEMO: Hover Me

 

a {
  color: #333333;
  text-decoration: none;
  position: relative;
}

Jetzt erstellen wir mit einem a:after unsere Linie die zum derzeitigen Punkt noch eine Breite von 0% hat. Sie wird beim Hover auf 100 Prozent gesetzt und durch eine Transition wird das animiert.

 

a:after {
  content: ''; /* content ist leer... */
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0%;
  border-bottom: 2px solid #333333;
  transition: 0.6s;
}

a:hover:after {
  width: 100%;
}

 

WordPress: Copyright im Footer entfernen

Bei den meisten Themes ist im Footer ein Hinweis auf den Author des Themes oder auch auf WordPress selbst eingebaut.

So zeigen die Standard Themes in der Regel: Stolz präsentiert von WordPress .

Jedoch ist dieser Hinweis nicht immer erwünscht und macht es sogar Hackern einfacher einen WordPress Blog zu finden (google: „site:.de stolz präsentiert von WordPress“).

Das Entfernen ist schnell gemacht. Mit dem FTP Client (oder Admin->Design->Editor) die Datei Footer.php eures Themes öffnen und folgendes Entfernen:

<a href="<?php echo esc_url( __( 'http://wordpress.org/', 'twentytwelve' ) ); ?>" title="<?php esc_attr_e( 'Semantic Personal Publishing Platform', 'twentytwelve' ); ?>"><?php printf( __( 'Proudly powered by %s', 'twentytwelve' ), 'WordPress' ); ?></a>

Darf ich es überhaupt entfernen? Aufgrund der GPL Lizens unter der WordPress veröffentlich wird ist eine Entfernung des Hinweises kein Problem. Wer will kann WordPress aber einen Backlink im Impressum spendieren.
Anders sieht es natürlich bei anderen Themes aus, hier sollten unbedingt die Lizensbedingungen studiert werden, sonst kann es schnell zu einer Abmahnung kommen.

WordPress: Anzahl an Queries und Erstellungszeit ausgeben

Über denn Sinn lässt sich hier streiten, aber s0 manch einen Entwickler interessiert es wieviele Queries für die vollständige Erstellung der Seite benötigt wurden. WordPress zählt diese praktischerweise schon mit, man muss sie nur ausgeben. Ebenso lässt sich die Zeit ausgeben, wie lange der Server benötigte die Inhalte zusammenzusezten.

Geht in den Footer eures Themes und fügt folgenden Schnipsel ein:

<?php echo get_num_queries(); ?>
 Abfragen in 
<?php timer_stop(1); ?>
 Sekunden.

So ergibt die Startseite von Schnipsellager folgende Ausgabe: 31 Abfragen in 0,263 Sekunden.
Eine Menge Queries – wenig Zeit.