In meinem letzten Post habe ich die Facebook Like bzw. Share Funktion kritisiert.
Nun will ich Euch hier eine Möglichkeit zeigen, mit der Ihr auch ohne den ganzen nachgeladenen Mist von Facebook eine Sharefunktion in Euren Blog oder Eure Seite etc. einbauen könnt. Außerdem ist es mit dieser Methode möglich, sehr einfach seinen eigenen Shareicon bzw. -bild zu benutzen.

Mein Zeil war es, die wortwörtliche Kontrolle von Facebook zu umgehen, weil durch das einbinden des offiziellen Likescripts, eine Menge an Hintergrundinformationen, Scripte etc, nachgeladen werden. Diese Thematik wird aktuell auch unter den Datenschützern behandelt, weil Facebook mit dieser Funktion die Besucher der Seite 'ausspionert' und Daten sammelt.

Nun zum eigentlichen Thema, wir wollen also einen Sharebutton auf unserer Seite, unserem Blog etc. einbinden.
Dafür stellt uns Facebook ein Script zur Verfügung, die wir direkt ansprechen können.

Allgemein sieht der Sharebefehl wie folgt aus:

<a href="http://www.facebook.com/sharer.php?u=LINK&amp;t=TITEL" target="_blank"> 
Linktext/Bild etc.
</a>

Beim Parameter 'u' fügen wir die zu teilende URL ein und bei 't' den Titel, der auf Facebook erscheinen soll, in meinem Fall der Blogtitel zusammen mit dem Beitragstitel.

Nun zu der WordPress-Methode. Hier haben wir es leicht, weil WordPress uns die erforderlichen zwei Werte als Variable zur Verfügung stellt.
So würde es dann für WordPress aussehen:

<a href="http://www.facebook.com/sharer.php?u=<?php the_permalink() ?>&amp;t=<?php the_title(); ?>" target="_blank">
Linktext/Bild etc.
</a>

<?php the_permalink() ?>

ist der Link zum Blogbeitrag.

<?php the_title(); ?>

ist der Titel des Blogbeitrages.

Somit hätten wir, ohne den ganzen Mist von Facebook, einen Sharelink/-button etc. eingebunden.

Mit freundlichen Grüßen,
~bursali

Seit gestern ist Firefox 4 offiziell verfügbar.
FF4 gefällt mir persönlich gut bis jetzt, außer ein paar Kleinigkeiten. Diese werden bestimmt bald verbessert. (:

Eigentlich wollte ich nicht auf Firefox 4 wechseln, bis einige wichtige Addons kompatibel mit der Version 4 sind.
So lange muss man aber nicht warten, dass will ich Euch hier kurz erklären.
Durch das Ändern einer Zahl ist es möglich, Addons von Firefox 3.6.x und darunter mit Firefox 4 zu benutzen.
Dies ist keine offizielle Lösung, deshalb kann es zu Problemen führen, bei mir hat aber bis jetzt alles funktioniert. (:

Ich nehme als Beispiel das "Live HTTP Headers"-Addon.

1. Wir gehen auf addons.mozilla.org & suchen unser Addon.
2. Nun sehen wir, dass das Addon nicht mit Firefox 4 kompatibel ist, "Not available for Firefox 4.0"
   

   Live HTTP Headers - Mozilla - Screenshot

3. Wir machen einen Rechtsklick auf "Add to Firefox" & auf "Link-Adresse kopieren"
   

   Live HTTP Headers - Link kopieren

4. Nun fügen wir den kopierten Link in einen anderen Browser ein, um den Downloadlink von unserem Addon zu bekommen.
   Zur Veranschaulichung:
   Der kopierte Link:

   https://addons.mozilla.org/firefox/downloads/latest/3829/addon-3829-latest.xpi?src=search

   Der Downloadlink:

   http://releases.mozilla.org/pub/mozilla.org/addons/3829/live_http_headers-0.16-fx+sm.xpi

5. Nach dem wir den Link aufgerufen haben, können wir unser Addon runterladen. Speichert es auf dem Desktop oder einem beliebigem Ort ab.
6. Der Dateiname von meinem Addon lautet:
   "live_http_headers-0.16-fx+sm.xpi",
   das benennen wir jetzt um, damit wir ein Archiv haben. Ihr könnt ".rar" oder ".zip" hinzufügen. Ich werde ".rar" verwenden. Somit heißt die umbenannte Datei
   "live_http_headers-0.16-fx+sm.xpi.rar"
7. Jetzt öffnen wir die Datei mit einem Archivierungsprogramm, zum Beispiel Winrar.
   

   Live HTTP Headers - Archivscreenshot

8. Wir extrahieren die Datei "install.rdf" & öffnen diese mit einem beliebigen Texteditor.
   Wir suchen die folgende Stelle: 

    <!-- Firefox -->
       <em:targetApplication>
         <Description>
           <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
           <em:minVersion>0.8</em:minVersion>
           <em:maxVersion>3.6.*</em:maxVersion>
         </Description>
       </em:targetApplication>

   und ändern die "3.6.*" um in "4.6.*".

9. Nun speichern wir die Datei ab & ziehen es wieder in das offene Archivfenster, um die geänderte Datei dem Installer hinzuzufügen bzw. erstellen ein neues Archiv, wenn Ihr das Archiv bei Punkt 8 komplett extrahiert habt.
10. Wir entfernen die Endungen ".rar" oder ".zip" von der Datei, damit es wieder den originalen Dateinamen erhält.
    Aus "live_http_headers-0.16-fx+sm.xpi.rar" wird bei mir also "live_http_headers-0.16-fx+sm.xpi".
11. Wir starten Firefox und ziehen diese Datei nun einfach in das Browserfenster. Daraufhin erscheint die Abfrage zum Installieren und unser Addon funktioniert.

Live HTTP Headers - Proofscreen #1

Live HTTP Headers - Proofscreen #2

Ich wünsche Euch einen schönen Abend,
~bursali

Viele kenne dieses "Problem", man verbringt Minuten oder Stunden um einen Artikel zu verfassen und dann wird dieser einfach kopiert, ohne das der "Kopierer" oder sagen wir lieber der "Copy & Paster" die Quelle angibt.
Das ist natürlich sehr ärgerlich und zum Teil auch illegal. (;

Es gibt einen sehr einfachen Trick, um den unachtsamen "Copy & Pastern" die Quelle mitkopieren zu lassen.

Ich werde das Beispiel für WordPress zeigen, dieses Prinzip kann natürlich auf jede CMS und jede persönliche Seite/jedes persönliche Script angewendet werden. (:

1. Da einige Browser Kompatibilitätsprobleme haben, müsst Ihr folgenden CSS Code in Eure Stylesheetdatei einfügen:

   /* Copyright */
    
   .copyright {
   display:none;
   }
    
   /* End Copyright */

2. Nun öffnet Ihr die gewünschte Datei und fügt folgenden Code an der Stelle ein, wo Ihr den versteckten Text haben wollt:
   (Achtung! Dieses Codebeispiel ist für WordPress! Für den Gebrauch bei einem anderen CMS etc. Bitte anpassen.)

   <span class="copyright" style="display: none;">
   Original Text by: <a href="<?php the_permalink() ?>"><?php the_permalink() ?></a>
   </span>

3. Fertig!

Es ist wirklich sehr simpel aber auch sehr effektiv. (;

Nehmen wir mal an, jemand will diesen Text hier kopieren und irgendwo verteilen, dann wird Er den Text markieren und Ihn in einem Blog/Forum/... veröffentlichen, leider hat Er aber verpennt, den Text nochmals durchzulesen.
Seht Ihr was Ich meine? (;

~bursali

Original Text by: http://blog.bursali.eu/2010/09/25/versteckte-quelle-bei-copy-paste/

Falls es Fragen geben sollte, könnt Ihr gerne das Kontaktformular benutzen.

Schönen Abend noch,
~bursali

Wenn man krank ist, dann vertreibt man sich mit sinnlosen Sachen den Tag, damit Er so schnell wie Möglich vergeht, Ich habe heute mal etwas "rumgegoogelt" & gesehen, dass sehr viele Blogger das Problem mit der Caption Funktion von WordPress haben.

Caption-Funktion, was ist das?

Der Begriff Caption heißt übersetzt Beschriftung, in unserem Fall eine Bildbeschriftung.

Mit der Caption-Funktion könnt Ihr Euren eingebundenen Bildern kleine Beschriftungen zuordnen, dies ist zum  Beispiel hilfreich, wenn Ihr das Bild kommentieren wollt. Das Beispiel dazu findet Ihr bei meinem Beitrag, Back at home..

Ok. Ich habe es verstanden, wie realisiert man so etwas?

Dafür gibt es im Internet sehr viele Beispiele, hier werde Ich Euch eine vorstellen. Dieses Beispiel ist am weitesten Verbreitet, deswegen werde Ich Euch auch dieses zeigen.
Die Vorgehensweise ist sehr einfach und selbsterklärend.

1. Ihr müsst erst einmal gucken, ob in der CSS-Datei (Stylesheet) schon eine Funktion mit dem Namen "wp-caption" definiert ist, falls dies der Fall sein sollte, macht Ihr eine Sicherheitskopie Eurer CSS-Datei. Danach ersetzt Ihr den originalen "wp-caption" Teil mit dem unteren.
   Falls Ihr es nicht in Eurer CSS-Datei definiert haben solltet, könnt Ihr den unteren Code einfach hineinkopieren.

   
   

   /* Captions */
   .aligncenter,
   div.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
   }
    
   .wp-caption {
   border: 1px solid #ddd;
   text-align: center;
   background-color: #f3f3f3;
   padding-top: 4px;
   margin: 10px;
   -moz-border-radius: 3px;
   -khtml-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px;
   }
    
   .wp-caption img {
   margin: 0;
   padding: 0;
   border: 0 none;
   }
    
   .wp-caption p.wp-caption-text {
   font-size: 11px;
   line-height: 17px;
   padding: 0 4px 5px;
   margin: 0;
   }
   /* End captions */

2. Nun nehmt Ihr ein Bild Eurer Wahl & klickt auf die WordPressfunktion um Bilder hinzuzufügen.
   Falls Ihr nicht wisst wo diese Funktion ist, Sie befindet sich neben "Hochladen/Einfügen" im Beitragseditor [].
3. In dem nun erscheinend Fenster ladet Ihr Euer Bild hoch.
4. Nachdem Ihr das Bild hinzugefügt habt, werdet Ihr es in Eurem Editor als Vorschau sehen. Nun geht Ihr auf das Bild und klickt das linke Kästchen an [].
5. Danach erscheint nochmal ein Fenster, in diesem Fenster tragt Ihr unter "Bildbeschreibung bearbeiten" die "Bildbeschriftung" ein [].
6. Jetzt solltet Ihr das gleiche Ergebnis wie bei meinem oben genannten Beispiel erreicht haben.

Soviel zum Allgemeinen einsetzen von den Captions.

Wo liegt nun das Problem?

Wenn Ihr nun versucht, mehrere Captions nebeneinander zu platzieren, werde Ihr spätestens nach dem zweiten Caption erkennen, dass es gewaltige Darstellungsprobleme gibt.
Ich habe versucht das Problem mit ein paar Anpassungen der CSS-Datei zu lösen, jedoch scheitert es immer an ein paar Ecken.

Aha, ok. Wie hast Du es dann gelöst?

An dem Tag, wo Ich den oben genannten Beitrag verfasst habe, hatte Ich auch keine Lust mehr rumzumachen und habe versucht das Problem per HTML zu lösen. Die Lösung ist sehr einfach - Tabellen.

Wenn man eine Tabelle erstellt, dann werden die Captions nebeneinander dargestellt und das mit sehr wenig Arbeit.
Dafür müsst Ihr aber im HTML-Tab arbeiten, da WordPress die Änderungen im Visuellen Editor ignoriert.

So sieht das Ergebnis bei mir aus:

<table border="0" align="center">
<tbody>
<tr>
<td>
 
[caption id="" align="alignnone" width="132" caption="Flugzeug + tolles Wetter = *-* #1"]<a href="http://www.abload.de/img/dsc00518mmx0.jpg" target="_blank"><img title="Flugzeug + tolles Wetter = *-* #1" src="http://www.abload.de/thumb2/dsc00518mmx0.jpg" alt="" width="132" height="132" /></a>[/caption]</td>
<td><a href="http://www.abload.de/img/dsc005223722.jpg" target="_blank"><img title="Flugzeug + tolles Wetter = *-* #2" src="http://www.abload.de/thumb2/dsc005223722.jpg" alt="" /></a></td>
<td><a href="http://www.abload.de/img/dsc00532b7oi.jpg" target="_blank"><img title="Flugzeug + tolles Wetter = *-* #3" src="http://www.abload.de/thumb2/dsc00532b7oi.jpg" alt="" /></a></td>
</tr>
<tr>
<td><a href="http://www.abload.de/img/dsc_1184qjl7.jpg" target="_blank"><img title="Für 4€ die Stunde. (;" src="http://www.abload.de/thumb2/dsc_1184qjl7.jpg" alt="" /></a></td>
<td><a href="http://www.abload.de/img/dsc_11777kqs.jpg" target="_blank"><img title="*Keine Worte finden kann*" src="http://www.abload.de/thumb2/dsc_11777kqs.jpg" alt="" /></a></td>
<td><a href="http://www.abload.de/img/dsc_11800vmf.jpg" target="_blank"><img title="Gute Nacht. &lt;3 #1" src="http://www.abload.de/thumb2/dsc_11800vmf.jpg" alt="" /></a></td>
</tr>
<tr>
<td><a href="http://www.abload.de/img/dsc00554483l.jpg" target="_blank"><img title="Gute Nacht. &lt;3 #2" src="http://www.abload.de/thumb2/dsc00554483l.jpg" alt="" /></a></td>
<td><a href="http://www.abload.de/img/dsc00546m7ja.jpg" target="_blank"><img title="*-* &lt;3 Karamell heißt die Süße." src="http://www.abload.de/thumb2/dsc00546m7ja.jpg" alt="" /></a></td>
<td><a href="http://www.abload.de/img/dsc00578vj06.jpg" target="_blank"><img title="Bursaspor - Konyaspor Spiel. Der Rauch kommt übrigens von Zigaretten!" src="http://www.abload.de/thumb2/dsc00578vj06.jpg" alt="" /></a></td>
</tr>
<tr>
<td><a href="http://www.abload.de/img/dsc00582djbk.jpg" target="_blank"><img title="Bursaspor - Konyaspor Spiel. #2" src="http://www.abload.de/thumb2/dsc00582djbk.jpg" alt="" /></a></td>
<td><a href="http://www.abload.de/img/dsc00602vvk4.jpg" target="_blank"><img title="Bursaspor &lt;3" src="http://www.abload.de/thumb2/dsc00602vvk4.jpg" alt="" /></a></td>
</tr>
</tbody>
</table>

Somit wäre das Problem gelöst, in man eine Tabelle mit drei Spalten und vier Zeilen erstellt.

Falls Ihr Fragen haben solltet, könnt Ihr gerne das Kontaktformular benutzen.

Mit freundlichen Grüßen,
~bursali

http://www.megaupload.com/?d=8E70RCPY

Wenn Ihr den Link so aufruft, müsst Ihr warten bis Ihr downloaden könnt.
Ersetzt Ihr aber das
"/?d" durch "/mgr_dl.php?d"

ladet Ihr mit Fullspeed als Premium User

Bei diesem Beispiel müsste es so aussehen:

http://www.megaupload.com/mgr_dl.php?d=8E70RCPY

Mit freundlichen Grüßen
~bursali

Zur PDF
PDF downloaden

PDF zu Word - OnlineConverter