Mittwoch, 23. Mai 2018

Wordpress Kommentar-Funktion DSGVO konform

Das Anpassen der eigenen Webseite an die DSGVO (GDPR) ist viel diskutiert und doch gibt es noch nicht für alles eine adäquate Lösung. Ebenso ist es mit der Kommentarfunktion in Wordpress, wenn diese auch für nicht-registrierte Besucher zur Verfügung stehen soll. Wordpress hat dabei nur an registrierte User gedacht.

Das problematische an der Kommentarfunktion von Wordpress ist schon länger das Speichern der IP. Zudem wird nun problematisch, wenn einerseits "Name" und "Emailadresse" als Pflichtangaben angegeben werden müssen und andererseits auch ohne Pflichtangabe deren Speicherung.

Es bestehen zwei Möglichkeiten:

1. Möglichkeit) Kommentarfunktion erweitern
Es wird die Funktionalität der Kommentarfunktion um eine Datenschutzerklärung-Checkbox erweitert und an dem Speichern der Daten nichts geändert.
Wichtig: Das Speichern/Archivieren von IP, Name und Emailadresse muss mit in die Datenschutzerklärung aufgenommen werden.
Zudem kann aus Punkt 2 die Funktion zur Änderung der IP verwendet werden (ganz unten).
<?php
/**
* Author:            fcojgodoy
* License:           GPL-2.0+
* Source: https://github.com/fcojgodoy/wp-comment-policy-checkbox/blob/master/wp-comment-policy-checkbox.php
*/
// Die Checkbox einbauen
function wpcpc_custom_fields($fields) {
// Hier die URL zur Webseite der Datenschutzerklärung einfügen
$url = 'https://www.example.com/datenschutz.php';
$read_and_accept = __('Ich akzeptiere die ', 'wp-comment-policy-checkbox');
$privcay_policy = __('Datenschutzerklärung', 'wp-comment-policy-checkbox');
$fields['top_copy'] = '<small class="comment-form-policy-top-copy">' . wpautop(get_option('wpcpc_policy_top_copy')) . '</small>';
$fields['policy'] = '<p class="comment-form-policy">' . '<label for="policy" style="display:block !important"><input id="policy" name="policy" value="policy-key" class="comment-form-policy__input" type="checkbox" style="width:auto" aria-required="true">' . esc_html($read_and_accept) . '<a href="' . esc_url($url) . '" target="_blank" class="comment-form-policy__see-more-link">' . esc_html($privcay_policy) . '</a><span class="comment-form-policy__required required"> *</span></label></p>';
return $fields;
}
add_filter('comment_form_default_fields', 'wpcpc_custom_fields');
// Den Check der Checkbox einbauen
function wpcpc_verify_policy_check($policydata) {
if (!isset($_POST['policy']) && !is_user_logged_in())
wp_die( '<strong>' . __('ERROR: ') . '</strong>' . __('Du musst die Datenschutzerklärung akzeptieren.', 'wp-comment-policy-checkbox') . '<p><a href="javascript:history.back()">' . __('&laquo; Back') . '</a></p>');
return $policydata;
}
add_filter('preprocess_comment', 'wpcpc_verify_policy_check');
?>

2. Möglichkeit) Kommentarfunktion kürzen
Es wird die Funktionalität der Kommentarfunktion auf das wesentliche gekürzt und keine Daten, außer der Kommentar selbst, gespeichert.
- Dazu darf in den Einstellungen > Diskussion "Benutzer müssen zum Kommentieren Name und E-Mail-Adresse angeben" nicht als Pflichtangaben angehakt sein.
- Der Infotext (comment_notes_before) "Deine E-Mail-Adresse wird nicht veröffentlicht." über dem Kommentarfeld kann mit der function edit_comment_before entfernt/geändert/gelöscht werden.
- Die neue WP Checkbox "Meinen Namen, E-Mail und Website in diesem Browser speichern, bis ich wieder kommentiere." kann mit der function edit_comment_cookies_checkbox entfernt werden.

Empfehlenswert:
- Zudem ein reCaptcha (Plugin) verwenden und den Spamfilter aktivieren.
- Mit der function edit_comment_after einen Hinweistext für eventuelle Freigabe (bei Spamverdacht) anzeigen lassen
- Die Checkbox aus Punkt 1 einfügen kann nicht schaden.

Mittels ein paar Funktionen, die einfach in die functions.php des aktiven Themes kopiert werden können, lässt sich das Problem in den Griff bekommen. Die Funktionen sind mit Kommentaren versehen, die selbsterklärend sind. Am Ende noch ein paar SQL Befehle zur Bereinigung der Datenbank von bestehenden Daten.

Die Funktionen werden zur einfacheren Auswahl einzeln aufgelistet.

Los gehts!
<?php
// Checkbox "im Browser speichern" editieren
function edit_comment_cookies_checkbox($fields) {
$fields['cookies'] = '';
return $fields;
}
add_filter( 'comment_form_default_fields', 'edit_comment_cookies_checkbox' );
?>
<?php
// Formfield "Name" editieren. Entfernen = "Anonymous"
function edit_comment_author_field($fields) {
$fields['author'] = '';
return $fields;
}
add_filter( 'comment_form_default_fields', 'edit_comment_author_field' );
?>
<?php
// Formfield "Email" editieren
function edit_comment_email_field($fields) {
$fields['email'] = '';
return $fields;
}
add_filter( 'comment_form_default_fields', 'edit_comment_email_field' );
?>
<?php
// Formfield "Website" editieren
function edit_comment_url_field($fields) {
$fields['url'] = '';
return $fields;
}
add_filter( 'comment_form_default_fields', 'edit_comment_url_field' );
?>
<?php
// comment-notes über dem Kommentarfeld editieren.
function edit_comment_before($defaults) {
$defaults['comment_notes_before'] = '';
return $defaults;
}
add_filter( 'comment_form_defaults', 'edit_comment_before' );
?>
<?php
// comment-notes unter dem Kommentarfeld editieren.
function edit_comment_after($defaults) {
$defaults['comment_notes_after'] = '<p class="comment-notes">' . __( 'Dein Kommentar muss eventuell erst noch freigegeben werden.' ) . ( $req ? $required_text : '' ) . '</p>';
return $defaults;
}
add_filter( 'comment_form_defaults', 'edit_comment_after' );
?>
<?php
// "IP" editieren
function edit_comment_ip()

 return "127.0.0.1"; // localhost
}
add_filter( 'pre_comment_user_ip', 'edit_comment_ip', 50);
?>
<?php
// Author "Name" editieren
function edit_comment_author_name()
{
return "Gast";
}
add_filter( 'pre_comment_author_name', 'edit_comment_author_name', 50);
?>
Zum Ausblenden der Namen der Kommentar-Autoren im Gästebuch dieses CSS in die style.css des aktiven (child) Themes einfügen:
cite.comment-author {
display: none !important;
Die SQL Befehle zum bereinigen der Datenbank von vorhandenen Daten aus der Kommentarfunktion. Bitte einzeln verwenden.
VORSICHT: Löschbefehle! Besser vorher die Datenbanktabelle "kopieren" zur Wiederherstellung.
UPDATE `wp_comments` SET `comment_author_IP`='127.0.0.1'
UPDATE `wp_comments` SET `comment_author_email`=''
UPDATE `wp_comments` SET `comment_author_url`=''
UPDATE `wp_comments` SET `comment_author`='Gast'
Mehr Informationen zu den default-Werten der functions auf der comment_form Wordpress-Codex-Seite: https://codex.wordpress.org/Function_Reference/comment_form

Dies ist keine Rechtsberatung.
Keine Garantie. Keine Gewähr. Kein Support.
Weiterlesen »

Samstag, 31. März 2018

Uberspace Email - Qmail - Vmail

Uberspace bietet in seinem Webhost-System auch ein Email-System. In dem Uberspace Email-System besteht eine default-Emailadresse mit einem default-Email-Postfach. Zudem kann QMail und VMail als Erweiterung des Email-Systems genutzt werden. Wie, das wird im folgenden Tutorial erklärt.

Uberspace-default

Uberspace-default-Emailadresse
Die Uberspace-default-Emailadresse setzt sich wie folgt zusammen:
user@server.uberspace.de
Mit der Verwendung einer eigenen Domain:
user@example.com

Uberspace-default-Email-Postfach
Das Uberspace-default-Email-Postfach befindet sich im Verzeichnis:
/home/user/Maildir/

Uberspace-default-Email-Passwort
Das Uberspace-default-Email-Passwort ist zugleich das SSH-Passwort (u.a. für SFTP-Zugang).

Unterschied QMail - VMail

QMail:
  • Mit QMail können beliebig viele Alias-Emailadressen angelegt werden.
  • Mit QMail werden alle Emails in einem Verzeichnis/Postfach gespeichert.
  • Bei QMail muss immer auch das SSH-Passwort verwendet werden.


VMail:
  • Mit VMail können beliebig viele separate Email-Postfächer angelegt werden.
  • Für jedes VMail-Postfach können über QMail beliebig viele Alias-Emailadressen angelegt werden.
  • Jedes VMail-Postfach hat sein eigenes Passwort, das nach belieben geändert werden kann.

Informationen

Die default-Voreinstellungen eines Uberspace-Accounts machen die Erklärung etwas schwierig, da schon eine Konfiguration besteht. Das Tutorial beginnt nicht mit Uberspace-Grundeinstellungen, sondern ohne diese, also sozusagen blank. Der Unterschied zu den Uberspace-Grundeinstellungen wird jeweils in eckigen Klammern erwähnt.

Uberspace nutzt für Emails QMail und VMail.
Für die Verwendung der Uberspace-default-Emailadresse mit Uberspace-default-Email-Postfach sind keine QMail .qmail... Dateien und kein VMail notwendig. Einige dieser .qmail... Dateien sind in der Uberspace-Grundkonfiguration schon vorhanden. Sie könnten auch gelöscht werden, was nicht zu empfehlen ist.

Alle ausgeführten Konfigurationen benötigen bis zu 5 Minuten, bis sie wirksam werden.

Die Zeilen mit den Pfeilen "->" dürfen/sollen/müssen nicht in die .qmail-... Dateien geschrieben werden.

QMail

Alle eingehenden Emails werden zuerst von QMail verarbeitet.
QMail extrahiert zuerst den Email-Namen vor dem "@" und setzt bei allen eingehenden Emailadressen, die keine Uberspace-default-Emailadresse sind, den Usernamen "user" mit Bindestrich "-" vorne an. Dann fügt QMail automatisch den Hostnamen "@server.uberspace.de" an, wenn nicht schon vorhanden.
alias@example.com
user-alias@example.com
-> .qmail-alias "user-info"
user-info@server.uberspace.de


Die QMail .qmail Datei

[keine .qmail-default Datei]
[keine .qmail-... Dateien]
Mit einer .qmail, bzw. deren Inhalt, können alle Emails, die an die Uberspace-default-Emailadresse gesendet werden, an eine externe Emailadresse weitergeleitet werden.
.qmail externe@example.com
-> externe@example.com

QMail-Emailadressen

Die QMail .qmail-... Dateien
[keine .qmail-default Datei]
[keine .qmail Datei]
Mit .qmail-... Dateien im Verzeichnis /home/user/ können beliebig viele (weitere) Email-Adressen angelegt werden.
Die .qmail-... Dateien sind einfache Textdateien.
Diese QMail-Emailadressen sind wie folgt zusammengesetzt:
.qmail-name
name@user.server.uberspace.de
user-name@server.uberspace.de
name@example.com
Ab U7: name@user.uber.space (nicht: user-name@uber.space)
In den Emailadressen muss entweder der Uberspace-Username oder eine eigene Domain vorkommen, damit diese zugewiesen werden können.

Wenn die Emails dieser QMail-Emailadressen in dem Uberspace-default-Email-Postfach gespeichert werden sollen, dann muss in den .qmail-... Dateien der Username eingetragen werden.
.qmail-name user
-> /home/user/Maildir/

Wenn die Emails dieser QMail-Emailadressen an eine externe Email-Adresse weitergeleitet werden sollen, dann muss in den .qmail-... Dateien die externe Emailadresse eingetragen werden.
.qmail-name externe@example.com
-> externe@example.com

Info: Jede .qmail-... Datei funktioniert autonom.

Bei Emailadressen, für die keine .qmail-... Datei existiert, wird von QMail eine "failure notice" zurückgesendet.

Wenn eine dieser QMail-Emailadressen gelöscht werden soll, dann einfach die entsprechende .qmail-... Datei löschen. Dann wird bei Emails an diese Emailadresse von QMail eine "failure notice" zurückgesendet. Wenn das unerwünscht ist, dann kann in die .qmail-... Datei eine Raute "#" eingetragen werden. Mit einer # werden die Emails an /dev/null/ weitergeleitet, also unwideruflich gelöscht und ohne eine "failure notice" oder ähnlich zurückzusenden.
.qmail-name #
-> /dev/null/


Die QMail .qmail Datei
[keine .qmail-default Datei]
[eine oder mehrere .qmail-... Dateien]
Mit der .qmail, bzw. deren Inhalt, können alle .qmail-... Datei Emailadressen mit nur einem Eintrag an eine externe Emailadresse gesendet werden,
.qmail externe@example.com
-> externe@example.com
[.qmail-default |/usr/bin/vdeliver]
[eine oder mehrere .qmail-... Dateien]oder in einem bestehenden VMail-Postfach gespeichert werden. Dazu das Kürzel Username-Postfachname verwenden, oder den Pfad zum VMail-Postfach.
.qmail user-postfach
-> /home/user/users/postfach/
oder
.qmail ./users/postfach/
-> /home/user/users/postfach/
Dabei werden auch immer alle Emails, die an die Uberspace-default-Emailadresse gesendet werden, an diese externe Emailadresse weitergeleitet oder in dem VMail-Postfach gespeichert.


Die QMail .qmail-default Datei
Mit der .qmail-default Datei, bzw. deren Inhalt, werden alle Emailadressen abgefangen, für die es keine .qmail-... Datei Emailadresse gibt, also keine QMail-Emailadresse gibt. Bei der .qmail-default Datei landen also Emails von allen möglichen Emailadressen außer den QMail-Emailadressen.
In die .qmail-default Datei kann eine externe Emailadresse eingetragen werden, damit diese "alle weiteren möglichen" Emailadressen dorthin weitergeleitet werden. Normalerweise braucht das kein Mensch.
.qmail-default externe@example.com
-> externe@example.com
Oder die Emails an diese "alle weiteren möglichen" Emailadressen sollen keine "failure notice" zurückgeben, sondern still nach "/dev/null/" verschwinden und unwiderruflich gelöscht werden.
.qmail-default #
-> /dev/null/
Wenn aber VMail genutzt werden will, dann muss in die .qmail-default Datei der Pfad zu VMail "|/usr/bin/vdeliver" eingetragen werden. Das "|" bedeutet, dass es ein Pfad zu einem Programm ist.
.qmail-default |/usr/bin/vdeliver
-> VMail
Damit werden "alle weiteren möglichen" Emailadressen, für die es keine QMail-Emailadresse gibt, an VMail weitergeleitet und von VMail verarbeitet. Gibt es zu diesen von QMail an VMail geleiteten Emailadressen kein VMail-Emailpostfach, dann sendet VMail ein "failure notice" oder ähnlich.

VMail

Die VMail-Postfächer befinden sich im Pfad:
/home/user/users/
Der Name eines VMail-Postfaches ist zugleich der VMail-Emailadresse-Name.
/home/user/users/postfach/
postfach@user.server.uberspace.de
user-postfach@server.uberspace.de
postfach@example.com
Ab U7: postfach@user.uber.space (nicht: user-postfach@uber.space)


VMail-Emailadressen und VMail-Postfächer

Einzelheiten zum erstellen von VMail-Emailadressen mit VMail-Postfächern sind dem Wiki (U6) oder Manual (U7) bei Uberspace zu entnehmen.
[.qmail-default |/usr/bin/vdeliver]
[keine .qmail-... Dateien]
[keine .qmail Datei]
Alle VMail-Emailadressen werden zuerst von QMail verarbeitet und von diesem über die .qmail-default Datei an VMail weitergeleitet.

Solange keine .qmail Datei besteht, die an ein VMail-Postfach weiterleitet, können bedenkenlos gleichnamige QMail-Emailadressen und VMail-Emailadressen angelegt werden. Die Emailadresse wird dann zuerst von QMail abgefangen und befolgt die Anweisungen in der entsprechenden .qmail-Datei. Wenn allerdings eine .qmail Datei besteht, die an ein VMail-Postfach weiterleitet, für dessen Emailadresse-Namen es auch eine .qmail-... Datei gibt, kommt es zu einem Looping, das in einer "failure notice" endet.

QMail und VMail Konflikt

[.qmail-default |/usr/bin/vdeliver]
[eine oder mehrere .qmail-... Dateien]
[.qmail Datei mit Weiterleitung an VMail-Postfach]
Es darf niemals eine gleichnamige .qmail-... Datei QMail-Emailadresse von der VMail-EMailadresse (VMail-Postfach-Name) geben, die in der .qmail Datei eingetragen ist. Es wird sonst ein Looping erzeugt, das zu einer "failure notice" führt.
.qmail-info user
.qmail user-info
/home/user/users/info/
-> looping "failure notice"
Wenn aber in diesem Beispiel in der .qmail-info eine externe Emailadresse eingetragen ist, dann wird kein Looping erzeugt. Weil die Email sozusagen vorher rausgekickt wird.
.qmail-info externe@example.com
-> externe@example.com
Hier besteht die Möglichkeit auch für alle anderen .qmail-... Datei QMail-Emailadressen, eingehende Emails an eine QMail-Emailadresse direkt per .qmail-... Datei in ein VMail-Postfach zu speichern. Dazu kann entweder das Kürzel Username-Postfachname oder der Pfad zum VMail-Postfach eingetragen werden. Aber niemals die Emailadresse, wegen des Looping.
.qmail-info user-info
-> /home/user/users/info/
oder auf direktem Weg:
.qmail-info ./users/info/
-> /home/user/users/info/
Mit der letzter Variante wird sowohl VMail als auch die .qmail-default und die .qmail umgangen. Das funktioniert also auch ohne .qmail-default und .qmail Datei.

Uberspace Email-Accounts in Thunderbird einrichten

Keine Garantie. Keine Gewähr. Kein Support.
Weiterlesen »

Freitag, 30. März 2018

Google Blogger/Blogspot Bilder Backup sichern/downloaden/löschen

Google Blogger/Blogspot bietet die Möglichkeit die Inhalte eines Blogs zu sichern. In diesem Backup sind aber keine Bilder enthalten. Die Bilder eines Blogs müssen extra gesichert werden. Es besteht die Möglichkeit ein Backup aller Bilder eines Blogs zu speichern, sowie für jedes Blog ein Bilder Backup zu speichern.

Google Blogger/Blogspot Bilder Backup speichern


Die Bilder in einem Google Blogspot Blog werden in einem Albumarchiv bei Google gespeichert. Jeder hat dort auf seine Bilder Zugriff. Pro Google Account gibt es ein Albumarchiv, dass pro Blog ein Bilderalbum/Verzeichnis hat. In dem Google Albumarchiv sind zudem weitere Bilder aus dem Google Account gespeichert. Das eigene Google Albumarchiv ist unter dieser URL zu finden:


Für die Sicherung eines Backups mit allen Bildern eines Blogs bitte in das jeweilige Album klicken. Dort befindet sich oben rechts ein Menü mit dem Menüpunkt "Album herunterladen".

Der Download kann je nach dem wie viele Bilder im Blog verwendet werden eine länger Zeit benötigen.
Es können vorher auch Bilder aussortiert werden, indem nicht mehr benötigte Bilder gelöscht werden.

Bilder in Blogger löschen


Wenn ein Blogpost gelöscht wird, werden nicht die im Blogpost verwendeten Bilder gelöscht. Diese müssen extra manuell im Google Albumarchiv gelöscht werden.

Keine Garantie. Keine Gewähr. Kein Support.

Weiterlesen »

Donnerstag, 29. März 2018

Uberspace Email-Accounts in Thunderbird einrichten

Uberspace ist ein beliebter Webhoster und Thunderbird ein beliebtes Email-Programm. Wie beides zusammen genutzt werden kann, wird hier kurz und bündig erklärt.

TUTORIAL: Uberspace Email-Accounts in Thunderbird einrichten.

Bei Uberspace hat jeder User eine Emailadresse mit Emailpostfach, die in U6 user@server.uberspace.de und in U7 user@uber.space ist. Mit eigener Domain besteht zudem die Emailadresse user@example.com. Das gilt für jede genutzte Domain, wenn mehrere Domains genutzt werden. Zudem können weitere Emailadressen und Emailpostfächer angelegt werden.

Uberspace bietet für das default Email-Postfach die Möglichkeit weiterer Email-Adressen über QMail und für weitere Email-Adressen mit eigenen Email-Postfächern VMail. Einzelheiten dazu sind dem Uberspace wiki oder manual zu entnehmen.

Uberspace-default-Emailadresse: user@server.uberspace.de / user@example.com / ab U7: user@uber.space
Uberspace-default-Emailpostfach: /home/user/Maildir/

Die QMail Dateien für QMail-Email-Adressen befinden sich im Verzeichnis /home/user/
Das QMail-default-Email-Postfach ist das Uberspace-default-Emailpostfach /home/user/Maildir/
Die VMail-Email-Postfächer befinden sich im Verzeichnis /home/user/users/

Es bestehen bereits die QMail-Emailadressen:
.qmail-hostmaster = hostmaster@user.server.uberspace.de / user-hostmaster@server.uberspace.de / hostmaster@example.com / ab U7: hostmaster@uber.space
.qmail-postmaster = postmaster@user.server.uberspace.de / user-postmaster@server.uberspace.de / postmaster@example.com / ab U7: postmaster@uber.space
.qmail-abuse  = abuse@user.server.uberspace.de / user-abuse@server.uberspace.de / abuse@example.com / ab U7: abuse@uber.space

Für weitere QMail Emailadressen am besten eine der soeben aufgelisteten kopieren und den Namen ändern. Bei Email-Adressen mit Punkt . einen Doppelpunkt : im Dateinamen verwenden.

QMail
Mit QMail können unter anderem Alias-Adressen für das Uberspace-default-Postfach (/home/user/Maildir/) mit der Uberspace-default-Emailadresse "user@server.uberspace.de" (ab U7 "user@uber.space") eingerichtet werdenn können ("user-alias@server.uberspace.de" oder "alias@user.server.uberspace.de" oder alias@example.com). Alle QMail-Emailadressen werden im default-Modus im Uberspace-default-Postfach gespeichert, wenn sie nicht explizit an eine externe Emailadresse weitergeleitet werden.
Ist in einer .qmail-... Datei nur der Uberspace-Username eingetragen, dann werden Emails an diese QMail-Emailadresse im Uberspace-default-Postfach gespeichert. Technisch gesehen passiert in diesem Fall eine Weiterleitung an die Uberspace-default-Emailadresse "user@server.uberspace.de". Weil das Qmail-System "@server.uberspace.de" automatisch anfügt, ist als Eintrag in eine .qmail-... Datei nur "user" notwendig.
QMail-Emailadresse: alias@example.com
QMail-Datei: .qmail-alias Inhalt: user
-> /home/user/Maildir/ (Uberspace-default-Postfach )

In Thunderbird kann für das Uberspace-default-Postfach als Benutzer für den Posteingangsserver und Postausgangsserver der Uberspace-Username verwendet werden. Es kann als Benutzer auch die Uberspace-default-Emailadresse "user@server.uberspace.de" und auch mit eigener Domain "user@example.com" verwendet werden.
QMail extrahiert nur den Email-Namen vor dem "@" und fügt automatisch den Hostnamen "@server.uberspace.de" an, wenn nicht schon vorhanden. Sowie setzt bei allen eingehenden Emailadressen, die keine Uberspace-default-Emailadresse sind, den Usernamen "user" mit Bindestrich "-" davor. Beispiel:
"user-info@server.uberspace.de" wird systemintern nicht geändert.
"info@user.server.uberspace.de" wird systemintern zu "user-info@server.uberspace.de" geändert.
"info@example.com" wird systemintern zu "user-info@server.uberspace.de" geändert.
Wichtig bei QMail-Emailadressen ist, dass entweder der Uberspace-Username oder eine eigene Domain darin enthalten ist, damit diese zugewiesen werden können.
.qmail-info
info@user.server.uberspace.de
user-info@server.uberspace.de
ab U7: info@user.uber.space (funktioniert nicht: user-info@uber.space)
info@example.com

Als Posteingangsserver und Postausgangsserver muss in Thunderbird die Subdomain des Uberspaces (der Hostname) angegeben werden "server.uberspace.de". Auch bei Verwendung einer eigenen Domain, da hier das Zertifikat nicht für die eigene Domain gilt.

VMail
Bei VMail ist es ähnlich wie soeben bei QMail beschrieben, weil alle VMail Emailadressen zuerst QMail durchlaufen und wenn sie dort nicht abgefangen werden, weil nicht vorhanden, dann durch die .qmail-default an VMail weitergeleitet werden.

In Thunderbird kann bei VMail-Postfächern als Benutzer für den Posteingangsserver und Postausgangsserver der Username mit VMail-Postfachnamen "user-postfach" verwendet werden. Es kann als Benutzer auch die VMail-Emailadresse "postfach@user.server.uberspace.de" und auch mit eigener Domain "postfach@example.com" verwendet werden. Wichtig ist hier wieder, dass entweder der Uberspace-Username oder die eigene Domain in der Email-Adresse vorkommt.

Bei einer Weiterleitung einer QMail-Alias-Emailadresse an ein VMail-Postfach muss in die .qmail-... Datei der Username mit VMail-Postfachnamen "user-postfach" eingetragen werden. Beispiel:
VMail-Postfach: info
QMail-Datei: .qmail-alias Inhalt: user-info
Systemintern geschieht dann folgendes:
alias@example.com
user-alias@example.com
-> .qmail-alias "user-info"
user-info@server.uberspace.de
-> .qmail-default -> VMail
Es darf nie eine .qmail-... Datei mit VMail-Postfachnamen, und umgekehrt, existieren. Das erzeugt ein looping mit failure notice.

Als Posteingangsserver und Postausgangsserver muss in Thunderbird die Subdomain des Uberspaces angegeben werden "server.uberspace.de". Auch bei Verwendung einer eigenen Domain, da hier das Zertifikat nicht für die eigene Domain gilt.

Thunderbird
Die automatischen Voreinstellungen, die beim erstellen eines neuen Email-Accounts in Thunderbird eingestellt werden, sind für Uberspace Email-Postfächer nicht richtig, wenn eigene Domains verwendet werden. Das zum Emailpostfach zugehörige Zertifikat gilt hier nur für uberspace.de und nicht für eigene Domains.

Schritt für Schritt

Es gibt im Tutorial einen Unterschied zwischen dem Uberspace-default-Postfach und einem VMail-Postfach.

In den Beispielen weren folgende Usernamen, Email-Adressen, Email-Postfächer und eigene Domains verwendet.
Username: user
Eigene Domain: example.com
QMail-Email-Adresse: x@example.com (.qmail-x Datei mit Inhalt "user")
VMail-Email-Postfach: x
VMail-Email-Adresse: x@example.com
INFO: Es ist nicht möglich eine gleichnamige QMail und VMail Email-Adresse anzulegen, bzw. ergibt das Konflikte. Es funktioniert nur entweder oder. Da in den folgenden Beispielen beides getrennt behandelt wird, ist das kein Problem. Mit der Verwendung verschiedener Email-Namen ist beides möglich.

1.) Konten-Einstellungen öffnen
Über das Thunderbird Menü die Konten-Einstellungen öffnen.
Thunderbird Email-Konten-Einstellungen - Uberspace

2.) Email-Konto hinzufügen
Das Drop-Down Menü "Konten-Atkionen" befindet sich unten links im Fenster "Konten-Einstellungen". Dort auf "E-Mail-Konto hinzufügen..." klicken.
Thunderbird Email-Konto hinzufügen - Uberspace

3.) Neues Email-Konto einrichten
In dem Fenster "Konto einrichten" einen Namen und eine Email-Adresse eingeben.
Ein Name ist Pflicht. Dieser kann später gelöscht/entfernt/geändert werden.
Als Email-Adresse kann auch eine mit eigener Domain verwendet werden.
Bitte noch kein Passwort eingeben.
Bitte das Häkchen bei "Passwort speichern" entfernen.
Danach auf den Button "Weiter" klicken. Das Fenster wird nun seinen Inhalt ändern.
Thunderbird Email-Konto einrichten - Uberspace

4.) Neues Email-Konto einrichten
Das Fenster hat seinen Inhalt geändert.
Jetzt nicht auf den Button "Fertig" klicken.
Als Server-Adresse muss bei "Posteingangs-Server" und "Postausgangs-Server" unbedingt die Uberspace-Server-Adresse eingetragen werden. Da es ansonsten eine Fehlermeldung gibt.
Bei der Fehlermeldung keine "Sicherheits-Ausnahmeregel bestätigen".
Thunderbird Email Zertifikat - Uberspace
"Abbrechen" klicken!
Es muss jetzt nur auf den Button "Manuell bearbeiten" geklickt werden. Danach kann immer noch zwischen IMAP und POP3 gewählt werden.
Das Fenster wird sich nun vergrößern und erneut seinen Inhalt ändern.
Thunderbird Email-Konto einrichten - Uberspace


QMAIL oder VMail?
Im folgenden nun die Unterschiede zwischen QMail-Postfach und VMail-Postfach, sowie einer Variante, die bei beiden funktioniert.

QMail
5.1) Neues Email-Konto einrichten
Das Fenster hat sich verbreitert und seinen Inhalt geändert.
Hier kann jetzt bei "Posteingangs-Server" zwischen IMAP und POP3 gewählt werden.

"Posteingangs-Server:" server.uberspace.de
"Postausgangs-Server:" server.uberspace.de
"server" gegen den Servernamen austauschen.

Als "Benutzername" muss bei "Posteingangs-Server" und "Postausgangs-Server" in dieser Variante der Username eingetragen werden.
"Benutzername:"
"Posteingangs-Server:" user
"Postausgangs-Server:" user
"user" gegen den eigenen Usernamen austauschen.
Bei "Posteingangs-Server:" muss bei "SSL" unbedingt "SSL/TLS" ausgewählt werden.
Thunderbird Email-Konto einrichten - Uberspace
6.1) Neues Email-Konto einrichten
Jetzt auf den Button "Erneut testen" klicken.
Danach auf den Button "Erweiterte Einstellungen" klicken. Nicht auf den Button "Fertig" klicken.
Das Fenster schließt sich.
Thunderbird Email-Konto einrichten - Uberspace
  
VMail
5.2) Neues Email-Konto einrichten
Das Fenster hat sich verbreitert und seinen Inhalt geändert.
Hier kann jetzt bei "Posteingangs-Server" zwischen IMAP und POP3 gewählt werden.

"Posteingangs-Server:" server.uberspace.de
"Postausgangs-Server:" server.uberspace.de
"server" gegen den Servernamen austauschen.

Als "Benutzername" muss bei "Posteingangs-Server" und "Postausgangs-Server" in dieser Variante der Username mit VMail-Postfachname eingetragen werden. Im Beispiel hat der User den Namen "user" und das VMail-Postfach den Namen "x". Daraus ergibt sich der Benutzername "user-x".
"Benutzername:"
"Posteingangs-Server:" user-x
"Postausgangs-Server:" user-x
"user" gegen den eigenen Usernamen austauschen.
"x" gegen den eigenen VMail-Postfachnamen austauschen.
Bei "Posteingangs-Server:" muss bei "SSL" unbedingt "SSL/TLS" ausgewählt werden.
Thunderbird Email-Konto einrichten - Uberspace
6.2) Neues Email-Konto einrichten
Jetzt auf den Button "Erneut testen" klicken.
Danach auf den Button "Erweiterte Einstellungen" klicken. Nicht auf den Button "Fertig" klicken.
Das Fenster schließt sich.
Thunderbird Email-Konto einrichten - Uberspace

QMail sowie VMail
5.3) Neues Email-Konto einrichten
Das Fenster hat sich verbreitert und seinen Inhalt geändert.
Hier kann jetzt bei "Posteingangs-Server" zwischen IMAP und POP3 gewählt werden.

"Posteingangs-Server:" server.uberspace.de
"Postausgangs-Server:" server.uberspace.de
"server" gegen den Servernamen austauschen.

Als "Benutzername" kann bei "Posteingangs-Server" und "Postausgangs-Server" in dieser Variante die Email-Adresse eingetragen werden, sogar mit eigener Domain.
"Benutzername:"
"Posteingangs-Server:" x@example.com
"Postausgangs-Server:" x@example.com
Im Beispiel eine zusätzliche QMail-Email-Adress-Name "x" oder ein VMail-Postfach mit VMail-Email-Adresse "x".
"x" gegen den den eigenen zusätzlichen QMail-Email-Adress-Namen oder den eigenen VMail-Email-Postfachnamen austauschen.
Bei "Posteingangs-Server:" muss bei "SSL" unbedingt "SSL/TLS" ausgewählt werden.
Thunderbird Email-Konto einrichten - Uberspace
6.3) Neues Email-Konto einrichten
Jetzt auf den Button "Erneut testen" klicken.
Danach auf den Button "Erweiterte Einstellungen" klicken. Nicht auf den Button "Fertig" klicken.
Das Fenster schließt sich.
Thunderbird Email-Konto einrichten - Uberspace

7.) Konten-Einstellungen
Das Email-Konto wurde erstellt.
Jetzt können weitere Einstellungen im Email-Konto vorgenommen werden, bevor sich dieses zum ersten Mal mit dem Email-Postfach bei Uberspace verbindet.
Hier kann jetzt auch der Name gelöscht/geändert werden.
Info: Wenn im Menüpunkt "Server-Einstellungen" der "Lokale Ordner" geändert wird, wird Thunderbird einen Neustart verlangen. Wenn das in diesem Moment unerwünscht ist, dann auf "Abbrechen" klicken.
Thunderbird Konten-Einstellungen - Uberspace

Das war es auch schon. Viel Spaß beim emailen!


Keine Garantie. Keine Gewähr. Kein Support.
Weiterlesen »

Donnerstag, 8. Februar 2018

Shirtee-Shop in eigene Webseite einbinden

Shirtee ist einer von vielen POD (Print on Demand) Anbietern, die ihren Partnern einen Marktplatz und ein Shop-System anbieten. Beide liegen unter der Domain von Shirtee. Für das Anbieten der eigenen Shirtee-Produkte auf der eigenen Webseite bietet Shirtee derzeit noch keine eigenständige Möglichkeit.

Es besteht die Möglichkeit per PHP den Source Code des eigenen Shirtee-Shops zu extrahieren und diesen Quelltext in die eigene Webseite einzubinden. Zudem besteht die Möglichkeit die Produktbilder per PHP in ein Verzeichnis zu downloaden.

Bei beiden in diesem Tutorial erklärten PHP Scripts wird die originale Ansicht mit Auswahl und Sortierung aus dem eigenen Shirtee Shop übernommen. Die Produkte sind verlinkt zu den Kampagnen-Seiten bei shirtee.com. Zudem gibt es einen Button "Mehr anzeigen" mit Link zum eigenen Shirtee Shop.
Shirtee-Shop in eigene Webseite einbinden

JavaScript: Leider besteht keine Möglichkeit den eigenen Shirtee-Shop per JavaScript in die eigene Webseite einzubinden, da vom Server ein Header "X-Frame-Options: SAMEORIGIN" gesendet wird, der dies verhindert.

Hinweis: Leider besteht ein Problem mit der Verlinkung der Produkte zum eigenen Shop. Manchmal werden die verlinkten Kampagnen im eigenen Shop angezeigt, manchmal im Marktplatz. Die URL von beiden Ansichten ist leider die gleiche.

Für WordPress User gibt es das Shirtee WordPress Plugin (Link).

Tutorial Shirtee Shop in eigene Webseite einbinden

Die folgenden PHP Codes jeweils in eine .php Datei kopieren und von dieser den Source Code mittels (Beispiel:) "view-source:http://www.example.com/shirteephpcode.php" aufrufen, oder die .php Datei auf der Kommandozeile starten und das Ergebnis in eine Datei schreiben lassen (php shirtee.php >sourcecode.txt).

Wichtig: Was benötigt wird ist nicht die Browser-Ansicht, die von diesem PHP Script erzeugt wird (weil da noch das CSS fehlt), sondern der Quelltext, der über (Beispiel:) "view-source:http://www.example.com/path/to/shirteephpscript.php" einsehbar ist und von dort kopiert werden kann.


1. Methode (Produktbilder immer von Shirtee laden)

Mit diesem PHP Script wird ein Quellcode erzeugt, bei dem die <img src="..."> gleich bleibt, also die Produktbilder-Source ist shirtee.com. Die Produktbilder werden bei jedem Aufruf des später eingebundenen Quelltextes immer von shirtee.com geladen.

Im PHP Script muss folgendes angepasst werden:
  1. URL zum Shop
  2. Anzahl der anzuzeigenden Produkte
<?php
// YOUR SHIRTEE SHOP URL
$shirteeshopurl = "https://www.shirtee.com/de/store/myshop/";
//
// THE LIMIT FOR DISPLAYING PRODUCTS (24/32/48)
$shirteeshoplimit = "48";
//
// Extract the Store Name for the URL Query String
$shirteeshopurlexplode = explode("/", $shirteeshopurl);
$shirteestorename = $shirteeshopurlexplode[5];
//
$shirteeshopurllimit = $shirteeshopurl . "?limit=" . $shirteeshoplimit;
$shirteeshop = file_get_contents($shirteeshopurllimit);
//
if (((bool) $shirteeshop === true)) {
$shirteeshopexplodeone = explode('<ul class="products', $shirteeshop);
$shirteeshopexplode = explode('</div></div></div></div></li></ul>', $shirteeshopexplodeone[1]);
$shirteeshopold = '<div class="products' . $shirteeshopexplode[0] . '</div></div></div></div></li></div>';
//
// Put the URL Querystring at the campaign URLs START
$shirteestorecampaignhrefarray = [];
$shirteestorecampaignhrefnewarray = [];
$shirteestorecampaignhrefmatchesunique = array_unique($shirteestorecampaignhrefmatches[2]);
$shirteestorecampaignhrefmatchesuniquenew = array_values($shirteestorecampaignhrefmatchesunique);
//
for ($i = 0; $i < count($shirteestorecampaignhrefmatchesuniquenew); $i++ ) {
//
$shirteestorecampaignhref = $shirteestorecampaignhrefmatchesuniquenew[$i];
array_push($shirteestorecampaignhrefarray, $shirteestorecampaignhref);
//
if (strpos($shirteestorecampaignhref, "?")) {
$shirteestorecampaignhrefnew = $shirteestorecampaignhref . '&amp;shop=' . $shirteestorename;
} else {
$shirteestorecampaignhrefnew = $shirteestorecampaignhref . '?shop=' . $shirteestorename;
}
//
array_push($shirteestorecampaignhrefnewarray, $shirteestorecampaignhrefnew);
//
}
$shirteeshopold = str_replace($shirteestorecampaignhrefarray, $shirteestorecampaignhrefnewarray, $shirteeshopold);
// Put the URL Querystring at the campaign URLs END
$shirteeshopspacetonewline = preg_replace("/>\s</", ">\n<", $shirteeshopold);
$shirteeshoplitodiv = preg_replace("/<\/li><li/", "</div>\n\n<div", $shirteeshopspacetonewline);
$shirteeshoplitodiv = str_replace("<li", "\n\n<div", $shirteeshoplitodiv);
$shirteeshopnew = str_replace("li>", "div>\n\n", $shirteeshoplitodiv);
//
echo '<div class="shirteeshop">';
echo $shirteeshopnew;
echo '</div>';
}
?>
Diese Methode eignet sich zum einbinden in Wordpress.

Hinweis: Das CSS Stylesheet nicht vergessen (unten).


2. Methode (Produktbilder in ein Verzeichnis speichern) recommended/empfohlen

Mit diesem PHP Script wird ein Quellcode erzeugt, bei dem die Produktbilder in ein Verzeichnis gespeichert werden. Die <img src="..."> ist dann eine absolute oder relative unter der eigenen Domain (Bitte .htaccess "Base" beachten!). Die Produktbilder werden bei jedem Aufruf des später eingebundenen Quelltextes vom eigenen Server/Webhost geladen.

Im PHP Script muss folgendes angepasst werden:
  1. URL zum Shop
  2. Anzahl der anzuzeigenden Produkte
  3. Verzeichnisname für den Speicherort der Produktbilder
  4. Pfad zu den gespeicherten Produktbildern OHNE den Verzeichnisnamen
<?php
// YOUR SHIRTEE SHOP URL
$shirteeshopurl = "https://www.shirtee.com/de/store/shopname/";
//
// THE LIMIT FOR DISPLAYING PRODUCTS (24/32/48)
$shirteeshoplimit = "48";
//
// Extract the Store Name for the URL Query String
$shirteeshopurlexplode = explode("/", $shirteeshopurl);
$shirteestorename = $shirteeshopurlexplode[5];
//
// THE FOLDER-NAME FOR IMAGE SAVING ON YOUR WEBHOST
$shirteeshopimagesdir = "shirteeimages"; // relative path
//
$shirteeshopurllimit = $shirteeshopurl . "?limit=" . $shirteeshoplimit;
$shirteeshop = file_get_contents($shirteeshopurllimit);
if (!file_exists($shirteeshopimagesdir)) {
mkdir($shirteeshopimagesdir, 0755);
}
if (((bool) $shirteeshop === true)) {
$shirteeshopexplodeone = explode('<ul class="products', $shirteeshop);
$shirteeshopexplode = explode('</div></div></div></div></li></ul>', $shirteeshopexplodeone[1]);
$shirteeshopold = '<div class="products' . $shirteeshopexplode[0] . '</div></div></div></div></li></div>';
//
preg_match_all("/(src=\"(.*?)\")/", $shirteeshopold, $shirteestoreimgsrcmatches, PREG_PATTERN_ORDER);
//
$shirteestoreimagesrcurlarray = [];
$shirteestorenewimagessourcepatharray = [];
for ($i = 0; $i < count($shirteestoreimgsrcmatches[2]); $i++ ) {
//
$shirteestoreimagesrcurl = $shirteestoreimgsrcmatches[2][$i];
array_push($shirteestoreimagesrcurlarray, $shirteestoreimagesrcurl);
//
$shirteeshopimagesurlexplode = explode("/", $shirteestoreimagesrcurl);
$shirteeshopimagesfilename = end($shirteeshopimagesurlexplode);
$shirteeshopimagesdirfilename = $shirteeshopimagesdir . "/" . $shirteeshopimagesfilename;
//
if (!file_exists($shirteeshopimagesdirfilename)) {
$shirteeshopimagecreatefrompng = imagecreatefrompng($shirteestoreimagesrcurl);
imagealphablending($shirteeshopimagecreatefrompng, false);
imagesavealpha($shirteeshopimagecreatefrompng, true);
imagepng($shirteeshopimagecreatefrompng, $shirteeshopimagesdirfilename, 9, PNG_ALL_FILTERS);
}
//
// YOUR ABSOLUTE OR RELATIVE PATH TO THE SAVED IMAGES (for the source code <img src="...">)
$shirteestorenewimagessourcepath = "/" . $shirteeshopimagesdirfilename;
array_push($shirteestorenewimagessourcepatharray, $shirteestorenewimagessourcepath);
//
}
$shirteeshopold = str_replace($shirteestoreimagesrcurlarray, $shirteestorenewimagessourcepatharray, $shirteeshopold);
//
// Extract the Shirtee Store Campaign URLs
preg_match_all("/(href=\"(.*?)\")/", $shirteeshopold, $shirteestorecampaignhrefmatches, PREG_PATTERN_ORDER);
//
// Put the URL Querystring at the campaign URLs START
$shirteestorecampaignhrefarray = [];
$shirteestorecampaignhrefnewarray = [];
$shirteestorecampaignhrefmatchesunique = array_unique($shirteestorecampaignhrefmatches[2]);
$shirteestorecampaignhrefmatchesuniquenew = array_values($shirteestorecampaignhrefmatchesunique);
//
for ($i = 0; $i < count($shirteestorecampaignhrefmatchesuniquenew); $i++ ) {
//
$shirteestorecampaignhref = $shirteestorecampaignhrefmatchesuniquenew[$i];
array_push($shirteestorecampaignhrefarray, $shirteestorecampaignhref);
//
if (strpos($shirteestorecampaignhref, "?")) {
$shirteestorecampaignhrefnew = $shirteestorecampaignhref . '&amp;shop=' . $shirteestorename;
} else {
$shirteestorecampaignhrefnew = $shirteestorecampaignhref . '?shop=' . $shirteestorename;
}
//
array_push($shirteestorecampaignhrefnewarray, $shirteestorecampaignhrefnew);
//
}
$shirteeshopold = str_replace($shirteestorecampaignhrefarray, $shirteestorecampaignhrefnewarray, $shirteeshopold);
// Put the URL Querystring at the campaign URLs END
//
$shirteeshopnewline = preg_replace("/>\s</", ">\n<", $shirteeshopold);
$shirteeshoplidiv = preg_replace("/<\/li><li/", "</div>\n\n<div", $shirteeshopnewline);
$shirteeshoplidiv = str_replace("<li", "\n\n<div", $shirteeshoplidiv);
$shirteeshoplidiv = str_replace("li>", "div>\n\n", $shirteeshoplidiv);
$shirteeshopnew = str_replace('href="', 'target="_blank" href="', $shirteeshoplidiv);
//
//
echo '<div class="shirteeshop">';
echo $shirteeshopnew;
echo '</div>';
//
}
//
?>
Hinweise:
  1. Das Verzeichnis mit den gespeicherten Produktbildern nicht vergessen.
  2. Das CSS Stylesheet nicht vergessen (unten)
Hinweis Methode 1 und 2: Es ist nicht empfohlen die beiden PHP Scripts für den dauerhaften Gebrauch in die eigene Webseite einzubinden, weil bei jedem Aufruf der komplette Quelltext der angegebenen Shirtee-Shop-Webseite gedownloaded wird.

Besser: anstatt "echo $shirteeshopnew;" zu verwenden besser das Ergebnis in eine Datei schreiben lassen und per "include" in die Webseite einbinden.

Automatisierung: Die Möglichkeit einer Automatisierung besteht, indem für das PHP Script ein cron job angelegt wird, bei dem das Ergebnis, also der generierte Source Code, in eine Datei geschrieben wird und diese Datei per PHP include in die Webseite eingebunden wird.


3. Das CSS Stylesheet

Das CSS Stylesheet erzeugt die selbe Ansicht mit Effekten wie im eigenen Shirtee Shop und muss in die eigene Webseite eingebunden werden. Entweder per <style></style> in den HTML <head> der Webseite, oder in eine per <link rel="stylesheet" href="styles.css"> verlinkte .css Datei.
/* Shirteeshop Original CSS BEGIN */
.shirteeshopdiv .products-grid {
    max-width: 1114px;
    margin: 0 auto;
padding: 0;
text-align: center;
}
.shirteeshopdiv .products-grid .item {
    width: 23%;
    margin: 0.5%;
    display: inline-block;
}
.shirteeshopdiv .products-grid-campaigns .item {
    margin-bottom: 12px;
    background: #fff;
    border-radius: 1px;
    border: 1px solid #ccc;
    -webkit-transition: transform .2s linear 0s;
    -moz-transition: transform .2s linear 0s;
    -o-transition: transform .2s linear 0s;
    transition: transform .2s linear 0s;
    z-index: 1;
vertical-align: top;
}
.shirteeshopdiv .products-grid-campaigns .product-image .product-image-zoom {
    -webkit-transition: all .2s linear 0s;
    -moz-transition: all .2s linear 0s;
    -o-transition: all .2s linear 0s;
    transition: all .2s linear 0s;
}
.shirteeshopdiv .products-grid .product-image img {
    width: 100%;
    height: auto;
}
.shirteeshopdiv .products-grid-campaigns .product-info {
    padding-bottom: 0;
    padding: 0;
    text-align: left;
    padding: 10px 18px 10px;
    padding-bottom: 10px;
    background: #f0f0f0;
    border-top: 1px solid #b5b5b5;
}
.shirteeshopdiv .products-grid .product-info {
    position: relative;
    padding-bottom: 65px;
}
.shirteeshopdiv .products-grid-campaigns .product-name {
    font-size: 19px;
    font-weight: 400;
    color: #000;
    text-align: left;
    margin: 0 0 7px;
    line-height: 24px;
    height: 24px;
    overflow: hidden;
    font-family: 'Open Sans',sans-serif;
    font-weight: 400;
    text-overflow: ellipsis;
    -webkit-transition: all .2s linear 0s;
    -moz-transition: all .2s linear 0s;
    -o-transition: all .2s linear 0s;
    transition: all .2s linear 0s;
}
.shirteeshopdiv .products-grid .product-name, .products-list .product-name {
    text-transform: uppercase;
    margin-bottom: 5px;
    font-family: "Raleway","Helvetica Neue",Verdana,Arial,sans-serif;
}
.shirteeshopdiv .products-grid h2.product-name, h3.product-name, h4.product-name, h5.product-name, p.product-name {
    margin: 0;
    margin-bottom: .5em;
    color: #636363;
    font-family: "Raleway","Helvetica Neue",Verdana,Arial,sans-serif;
    font-weight: 400;
    font-style: normal;
    line-height: 1.2;
    text-rendering: optimizeLegibility;
    text-transform: uppercase;
    font-family: "Helvetica Neue",Verdana,Arial,sans-serif;
    font-weight: normal;
    line-height: 1.4;
}
.shirteeshopdiv .products-grid-campaigns .product-name a {
    color: #000;
    text-decoration: none;
    text-transform: uppercase;
    font-family: 'Open Sans',sans-serif;
    font-weight: 400;
}
.shirteeshopdiv .products-grid-campaigns .price-box-text {
    float: left;
    font-size: 14px;
    padding: 8px 0 0;
    color: #939393;
white-space: nowrap;
}
.shirteeshopdiv .products-grid-campaigns .price-box {
    margin: 0;
    float: right;
    color: #a0a0a0;
    font-size: 13px;
    margin: 0 0 5px;
white-space: nowrap;
}
.shirteeshopdiv .products-grid-campaigns .price-box .price {
    font-weight: 700;
    font-size: 22px;
    font-weight: 600;
    font-family: 'Open Sans',sans-serif;
    color: #39c;
    line-height: 26px;
}
.shirteeshopdiv .products-grid-campaigns .item:hover {
    -webkit-transform: scale(1.03);
    -moz-transform: scale(1.03);
    -ms-transform: scale(1.03);
    -o-transform: scale(1.03);
    transform: scale(1.03);
    z-index: 2;
    -webkit-box-shadow: 0 0 10px 0 rgba(28,28,28,.4);
    box-shadow: 0 0 10px 0 rgba(28,28,28,.4);
}
.shirteeshopdiv .products-grid-campaigns .product-image:hover .product-image-zoom {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
}
.shirteeshopdiv .products-grid-campaigns .product-image {
    position: relative;
    padding: 0;
    margin: 10px;
    display: block;
    overflow: hidden;
    width: calc(100% - 20px);
}
.shirteeshopdiv .products-grid-campaigns .item:hover .product-info {
    border-radius: 0 0 3px 3px;
}
.shirteeshopdiv .products-grid-campaigns .item:hover .product-name {
    max-height: 80px;
    height: auto;
    white-space: normal;
}
.shirteeshopdiv .products-grid h2.product-name a:hover, h3.product-name a:hover, h4.product-name a:hover, h5.product-name a:hover, p.product-name a:hover {
    color: #39c;
    text-decoration: none;
}
/* Shirteeshop Original CSS END */

Keine Garantie. Keine Gewährleistung. Kein Support.
Verwendung auf eigenes Risiko.
Weiterlesen »

Freitag, 2. Februar 2018

Shirtee-Shop per Shop CSV in die eigene Webseite einbinden

Shirtee ist einer von vielen POD (Print on Demand) Anbietern, die ihren Partnern einen Marktplatz und ein Shop-System anbieten. Beide liegen unter der Domain von Shirtee. Für das Anbieten der eigenen Shirtee-Produkte auf der eigenen Webseite bietet Shirtee derzeit noch keine eigenständige Möglichkeit. Shirtee bietet aber eine CSV Datei für Amazon-Händler und Facebook-Marketing mit den wichtigsten Produkt-Informationen. Mit dieser CSV Datei und PHP können die eigenen Shirtee-Produkte in der eigenen Webseite angezeigt werden.

UPDATE: Die Methode per CSV Shop Datei taugt nicht besonders. In der CSV Datei sind Produktbilder aller möglichen Versionen der Produkte und aller Produktfarben. Es ist nicht so einfach hier Filter einzubauen, damit nicht wahllos alle angezeigt werden.
HIER ist eine Methode ohne CSV Datei erklärt: Shirtee-Shop embedded (Link).

Für WordPress User gibt es das Shirtee WordPress Plugin (Link).

Shirtee-Shop in eigene Webseite einbinden


Tutorial Shirtee-Shop per SHOP CSV in eigene Webseite einbinden

Es bestehen 2 Methoden. Bei der ersten Methode werden die Produktbilder immer von Shirtee geladen, bei der zweiten Methode werden die Produktbilder (wenn noch nicht vorhanden) zuerst auf dem eigenen Server/Webhost gespeichert.

Mit diesen beiden Methoden wird nicht ein kompletter Shirtee-Shop in die eigene Webseite eingebunden, sondern werden nur automatisiert die Produkt-Grafiken mit Produkt-Titel, Produkt-Beschreibung, Produkt-Preis und Produkt-Link zum Shirtee-Shop in die eigene Webseite eingebunden.
(Hinweis: Verlinkung der Produktbilder aktuell wegen eines Bugs nach Zufallsprinzip mit Ziel entweder Marktplatz oder eigener Shirtee-Shop [02.02.2018]).

Was benötigt wird:
  • CSV Datei aus einem Shirtee-Shop
  • Eigene Webseite
  • Zugang zu einem Server/Webhost-Verzeichnis mit PHP (evtl. noch ImageMagick).

1.) CSV Datei download

Die CSV Datei ist bei Shirtee im Login-Bereich unter dem linken Sidebar Menüpunkt "Shops" zu erreichen.
Für jeden erstellten Shirtee-Shop gibt es eine extra CSV Datei mit CSV download. Der Donwloadlink ist an dem CSV Symbol zu erkennen.

Shirtee-Shop in eigene Webseite einbinden


2.) CSV Datei upload

Diese Shirtee-Shop CSV Datei jetzt auf dem eigenen Server/Webhost speichern.


3.) PHP Script einbinden

Als nächstes das folgende PHP Script in die eigene Webseite einbinden und einige Parameter anpassen.
Das Script muss in den HTML <body>.
Anzupassen ist der Verweis zur CSV Datei. Wenn der Shop in einem CMS in mehreren Webseiten angezeigt werden soll, dann bitte einen absoluten Verweis verwenden.
Die Reihenfolge der Produkte kann Vorwärts oder Rückwärts sortiert werden. (Mehr Möglichkeiten bestehen derzeit noch nicht).

1. Methode - Produktbilder immer von Shirtee laden (nicht empfohlen)
<div class="shirteeshop">
<div class="shirteeshopheader">My Privat Shirtee-Shop</div>
<div class="shirteeshopdescription">T-Shirts - Girlies - Tank-Tops - Sweatshirts</div>
<?php
// PATH TO CSV FILE - Please swap the "//" at the beginning of the line.
// relativer Pfad
$shirteecsvfile = file('shopname_facebook_feed.csv', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
// absoluter Pfad
//$shirteecsvfile = file('/var/www/html/shopname_facebook_feed.csv', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
// URL Pfad
//$shirteecsvfile = file('https://www.example.com/shopname_facebook_feed.csv', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
//
// SORT: swap the "//" at the beginning of the line.
for ($i = 0; $i < count($shirteecsvfile); $i++ ) { // sort forward
//for ($i = (count($shirteecsvfile) -1); $i > -1; $i-- ) { // sort backward
//
$shirteecsvfileexplode = explode(";", $shirteecsvfile[$i]);
//
// BCTU004_16 - T-Shirt Männer
// A880_16 - T-Shirt Frauen (Girlie)
// G64200_16 - Tank-Top Männer
// 3361_16 - Tank-Top Frauen
// JH030_1624 - Sweatshirt Unisex
// PRODUCT ID EINFÜGEN - eine oder zwei (oder selbst erweitern) - Please swap the "//" at the beginning of the line.
if (strpos($shirteecsvfileexplode[0], "BCTU004_16")) {
//if (strpos($shirteecsvfileexplode[0], "BCTU004_16") || strpos($shirteecsvfileexplode[0], "A880_16")) {
//
$shirteecsvfileexplodelinkexplode = explode("?", $shirteecsvfileexplode[5]);
$shirteecsvfileexplodelink = $shirteecsvfileexplodelinkexplode[0];
$shirteecsvfileexplodeimgurl = $shirteecsvfileexplode[4];
$shirteecsvfileexplodetitle = preg_replace("/(^\"|\"$)/", "", $shirteecsvfileexplode[6]);
$shirteecsvfileexplodeprice = preg_replace("/(^\"|\"$)/", "", $shirteecsvfileexplode[7]);
$shirteecsvfileexplodedescription = preg_replace("/(^\"|\"$)/", "", $shirteecsvfileexplode[3]);
//
echo '<div class="shirteeproductdiv">';
echo '<div class="shirteeproductimgdiv"><a href="' . $shirteecsvfileexplodelink . '" target="_blank">';
echo '<img class="shirteeproductimg" src="' . $shirteecsvfileexplodeimgurl . '" width="200px" height="" alt="' . $shirteecsvfileexplodetitle . '" title="' . $shirteecsvfileexplodetitle . '">';
echo '</a></div>';
echo '<div class="shirteeproducttitlediv"><span>' . $shirteecsvfileexplodetitle . '</span></div>';
echo '<div class="shirteeproductpricediv"><span>' . $shirteecsvfileexplodeprice . '</span></div>';
echo '<div class="shirteeproductdescriptiondiv"><span>' . $shirteecsvfileexplodedescription . '</span></div>';
echo '</div>';
echo "\n";
}
}
?>
</div>
Die Auswahl der Produkte wird mittels der (gekürzten) Produkt-ID vorgenommen. Die Produkt-IDs können der CSV Datei entnommen werden. Einige Produkt-IDs sind im PHP Script vermerkt. Es ist möglich die PHP if-Regel mit einem ODER (||) zu erweitern, dann können mehrere Produkte angezeigt werden.


2. Methode - Produktbilder auf eigenem Server/Webhost speichern (empfohlen/recommended) 

Mit diesem Script werden die Produktbilder zuerst von Shirtee gedownloaded und auf dem eigenen Server/Webhost gespeichert, wenn sie dort noch nicht vorhanden sind.
Die URLs der Produktbilder aus der CSV Datei haben eine falsche Dateiendung (File Extension). Es sind keine "jpeg", sondern "png" Dateien. Im Script wird die File Extension geändert.
Bitte das Ziel-Verzeichnis für das Speichern der Produktbilder im PHP Script angeben (Vorauswahl: "shirteeimages").
<div class="shirteeshop">
<div class="shirteeshopheader">My Private Shirtee Shop</div>
<div class="shirteeshopdescription">T-Shirts - Girlies - Tank-Tops - Sweatshirts</div>
<?php
// PATH TO CSV FILE - Please swap the "//" at the beginning of the line.
// relativer Pfad
$shirteecsvfile = file('shopname_facebook_feed.csv', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
// absoluter Pfad
//$shirteecsvfile = file('/var/www/html/shopname_facebook_feed.csv', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
// URL Pfad
//$shirteecsvfile = file('https://www.example.com/shopname_facebook_feed.csv', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
//
// SORT: Please swap the "//" at the beginning of the line.
for ($i = 0; $i < count($shirteecsvfile); $i++ ) { // sort forward
//for ($i = (count($shirteecsvfile) -1); $i > -1; $i-- ) { // sort backward
//
$shirteecsvfileexplode = explode(";", $shirteecsvfile[$i]);
//
// BCTU004_16 - T-Shirt Männer
// A880_16 - T-Shirt Frauen (Girlie)
// G64200_16 - Tank-Top Männer
// 3361_16 - Tank-Top Frauen
// JH030_1624 - Sweatshirt Unisex
// PRODUCT ID EINFÜGEN - eine oder zwei (oder selbst erweitern) - Please swap the "//" at the beginning of the line.
if (strpos($shirteecsvfileexplode[0], "BCTU004_16")) {
//if (strpos($shirteecsvfileexplode[0], "BCTU004_16") || strpos($shirteecsvfileexplode[0], "A880_16")) {
//
$shirteecsvfileexplodelinkexplode = explode("?", $shirteecsvfileexplode[5]);
$shirteecsvfileexplodelink = $shirteecsvfileexplodelinkexplode[0];
$shirteecsvfileexplodeimgurl = $shirteecsvfileexplode[4];
$shirteecsvfileexplodetitle = preg_replace("/(^\"|\"$)/", "", $shirteecsvfileexplode[6]);
$shirteecsvfileexplodeprice = preg_replace("/(^\"|\"$)/", "", $shirteecsvfileexplode[7]);
$shirteecsvfileexplodedescription = preg_replace("/(^\"|\"$)/", "", $shirteecsvfileexplode[3]);
//
// DIRECTORY TO SAVE THE IMAGES - it's possible: "../../path/to/shirteeimages" (don't set a "/" at the start).
$shirteeimagesdir = "shirteeimages"; // relative path
if (!file_exists($shirteeimagesdir)) {
mkdir($shirteeimagesdir, 0755);
}
$shirteeimagespath = explode("/", $shirteecsvfileexplodeimgurl);
$shirteeimagesfilename = end($shirteeimagespath);
$shirteeimagesfilenamepng = preg_replace('"\.(jpeg)$"', '.png', $shirteeimagesfilename);
$shirteeimagespathfilename = $shirteeimagesdir . "/" . $shirteeimagesfilenamepng;
if (!file_exists($shirteeimagespathfilename)) {
$shirteecsvfileexplodeimg = imagecreatefrompng($shirteecsvfileexplodeimgurl);
imagepng($shirteecsvfileexplodeimg, $shirteeimagespathfilename, 9, PNG_ALL_FILTERS);
//
// PRODUKTBILDER RESIZE WENN IMAGEMAGICK INSTALLIERT: remove the "//" at the beginning of the second line.
$shirteeimagesresize = "mogrify -path " . $shirteeimagesdir . " -format png -resize 345x377 " . $shirteeimagespathfilename;
//shell_exec($shirteeimagesresize);
}
//
echo '<div class="shirteeproductdiv">';
echo '<div class="shirteeproductimgdiv"><a href="' . $shirteecsvfileexplodelink . '" target="_blank">';
echo '<img class="shirteeproductimg" src="' . $shirteeimagespathfilename . '" width="200px" height="" alt="T-Shirt Tank-Top Sweatshirt ' . $shirteecsvfileexplodetitle . '" title="T-Shirt Tank-Top Sweatshirt ' . $shirteecsvfileexplodetitle . '">';
echo '</a></div>';
echo '<div class="shirteeproducttitlediv"><span>' . $shirteecsvfileexplodetitle . '</span></div>';
echo '<div class="shirteeproductpricediv"><span>' . $shirteecsvfileexplodeprice . '</span></div>';
echo '<div class="shirteeproductdescriptiondiv"><span>' . $shirteecsvfileexplodedescription . '</span></div>';
echo '</div>';
echo "\n";
}
}
?>
</div>
INFO: Die Produktbild-Dateien haben eine sehr große Dateigröße bei 577x630 Pixel PNG. Ein Resize Image ist im Script eingebaut und kann freigeschalten werden, wenn ImageMagick auf dem Server installiert ist.

Check on the command line if ImageMagick is installed on the server:
mogrify --version


4.) CSS Stylesheet (Beispiel)

Jetzt noch ein passendes CSS Stylesheet dazu in die Webseite kopieren.
.shirteeshop {
width: 970px;
margin: 0 auto;
text-align: center;
border-top-style: dotted;
border-top-color: #0f0;
border-top-width: 6px;
border-bottom-style: dotted;
border-bottom-color: #0f0;
border-bottom-width: 6px;
padding-bottom: 20px;
}
.shirteeshopheader {
font-size: 3em;
font-weight: bold;
margin-top: 20px;
margin-bottom: 20px;
}
.shirteeshopdescription {
font-size: 1.4em;
margin-bottom: 20px;
}
.shirteeproductdiv {
width: 220px;
display: inline-block;
vertical-align: top;
margin: 5px;
}
.shirteeproductimgdiv {
padding: 5px;
}
.shirteeproductimg {
border: none;
border-radius: 10px;
}
.shirteeproducttitlediv {
font-weight: bold;
text-transform: uppercase;
}
.shirteeproductpricediv {
color: #080;
font-weight: bold;
text-decoration: underline;
}
.shirteeproductdescriptiondiv {
color: #666;
}
.shirteeproductimg:hover {
transform: scale(1.5,1.5);
border-style: dashed;
border-color: #0f0;
border-width: 15px;
border-radius: 30px;
}
Das Ergebnis:
Shirtee-Shop in eigene Webseite einbinden

5.) Sortierung und WORDPRESS

Für eine manuelle Sortierung, oder für das Einbinden in Wordpress, jetzt einfach den HTML Quellcode kopieren, die Produkte sortieren und anstatt dem PHP Script diesen Quellcode in die eigene Webseite sowie einen Wordpress-Artikel oder eine Wordpress-Page kopieren und das CSS Stylesheet sowie bei Methode 2 die Produktbilder nicht vergessen.


Keine Garantie. Keine Gewährleistung. Kein Support.
Verwendung auf eigenes Risiko.

Weiterlesen »

Mittwoch, 31. Januar 2018

Stickerei Effekt embroidery mit GIMP erstellen

Einen Stickerei Effekt, auf englisch "embroidery effect" mit Gimp erstellen ist nicht einfach und viele Anleitungen, Scripts und Plugins sind dafür schon vorhanden, die alle sehr unterschiedliche Ergebnisse liefern. Hier wird ein sehr simples Tutorial zur schnellen Erstellung eines Stickerei Effekts in Gimp erklärt.
Stickerei Effekt embroidery mit GIMP
Stickerei Effekte sind insbesondere auch in Print On Demand (POD) Shirt-Shops beliebt, wenn diese Stickerei anbieten. Ein einfarbiges Bild der Stickerei-Grafik wirkt für den Kunden langweilig. Ein Bild mit Stickerei Effekt lockt das Kaufinteresse mehr.

Tutorial Stickerei Effekt in GIMP 2.8.18

Im speziellen benutzt das Tutorial die Maße für eine Mütze-Stickerei für den POD Anbieter Shirtee.
Gimp - Neu - Breite 1100 (Pixel); Höhe 330 (Pixel); Erweiterte Einstellungen: X-Auflösung und Y-Auflösung 300,000 Pixel/in (DPI); Farbraum: RGB; Füllung Transparenz.
Werkzeugkasten - Text. Text schreiben und vergrößern auf Leinwandgröße.
Die Text-Buchstaben mit dem Zauberstab zu einer Auswahl markieren. iüöä-Punkte und so nicht vergessen. (Die "Shift" Taste auf der Tastatur [Links - Pfeil nach oben] gedrückt halten für Mehrauswahl).
Menü: Ebene - Ebene duplizieren. (Text-Ebene duplizieren)
Menü: Ebene - Neue Ebene (Füllfarbe: Weiß).
Menü: Bearbeiten - Löschen. (oder "Entf"/"Del").
Menü: Auswahl - Invertieren.
Menü: Filter - Licht und Schatten - Schlagschatten. (Versatz X -10; Y -10; Weichzeichnerradius 10; Farbe nach belieben (helle Schrift - dunkler Schatten); Deckkraft nach belieben (75%)).
Es ist eine Ebene "Drop Shadow" entstanden (Schein nach innen / Schatten nach innen).
Menü: Bild - Leinwand an Auswahl anpassen.
Im Ebenen-Fenster die Ebene mit der Füllfarbe ausblenden.
Im Ebenen-Fenster die Ebene "Drop Shadow" anwählen.
Menü: Ebene - Auf Auswahl zuschneiden.
Im Ebenen-Fenster die duplizierte Schrift-Ebene anwählen (#1).
Menü: Auswahl - Invertieren.
Menü: Filter - Künstlerisch - Leinwand (oben rechts; Tiefe 10).
Menü: Filter - Weichzeichnen - Bewegungsunschärfe (Linear; Länge 10; Winkel 0).
Menü: 2x Filter - verbessern - Unscharf maskieren (Radius 5; Menge 0,5; Schwellwert 0).
Eventuell: Im Ebenen-Fenster: Deckkraft 50%.
Eventuell: Menü: Farben - Wert umkehren.
Eventuell: Menü: Farben - Schwellwert (nach belieben).
Eventuell: Menü: Farben - Werte (nach belieben).
Menü: Bild - Auf Auswahl zuschneiden.
Menü: Bild - Skalieren (Breite mindestens 4400 sowie maximal 8000 Pixel und Höhe mindestens 1320 Pixel sowie maximal 8000 Pixel; X-Auflösung und Y-Auflösung 300,000 Pixel/in (DPI)).
Die Größe der Buchstaben hat Auswirkung auf den Effekt. Mit größeren Buchstaben wird der Stickerei Effekt feiner, mit kleineren Buchstaben wird der Stickerei Effekt gröber. Deshalb besser die Bild-Größe nach dem Effekt erstellen auf den gewünschten Wert ändern.

Beispiel-Grafiken mit Stickerei Effekt mit Gimp erstellt:
Die Grafiken mit weißem Schein nach innen / Schatten nach innen wirken hier mit weißem Hintergrund nicht besonders gut. Zum vergrößern und mit schwarzem Hintergrund einfach anklicken.

TIPP: Bei dunklem Hintergrund (Produktfarbe) eine helle Schrift mit dunklem Schatten/Schein nehmen.
Stickerei Effekt embroidery mit GIMP
Stickerei Effekt embroidery mit GIMP
Stickerei Effekt embroidery mit GIMP
Stickerei Effekt embroidery mit GIMP
Stickerei Effekt embroidery mit GIMP

Weiterlesen »