Wer öfter mal ein WordPress theme modifiziert sollte sich unbedingt mit dem Thema child theme ausseinandersetzen. Ich fasse mich in diesem Tutorial kurz und beschränke mich auf das Wichtigste.

1. Parent theme installieren
2. Ordner und Dateien anlegen

1. Parent theme installieren
Um ein child theme erstellen zu können ist es notwendig vorher ein theme zu installieren, das später als parent theme diesen soll. In diesem Beispiel installiere ich das theme namens “theme1943“. Sie können jedes andere x-beliebige Theme verwenden, es spielt keine Rolle welches WordPress theme Sie verwenden, es ist immer die gleiche Prozedur.

2. Ordner und Dateien anlegen
Als erstes brauchen Sie einen theme Ordner wo später die restlichen Dateien reinkommen sollen. Da das (parent-) theme “theme1943″ heisst nennen wir den neuen Ordner “theme1948_childtheme.”

wordpress child theme – theme Ordner

So dann brauchen Sie auf jeden Fall auch noch eine CSS Datei die Sie standesgemäß style.css nennen müssen. Also gehen Sie in Ihren Editor (Sie können auch mit der Bahn fahren) und legen dort eine CSS Datei an, die Sie (wie schon gesagt) style.css nennen und dann in ihrem neuen Ordner ablegen.

In dieser Datei müssen nun einige Angaben gemacht werden. Hier ist schonmal ein Rohling zum Reinkopieren:

/*--
	Theme Name: theme1943_childtheme
	Theme URI: http://template-help.com/
	Description: A theme for WordPress 3.2+ from Template-Help.com Collection
	Author: Template_Help.com
	Author URL: http://www.Template-Help.com/
	Template: theme1943
	Version: 1.0
--*/

@import url("../theme1943/style.css");

Ganz oben tragen Sie den Namen des WordPress themes ein, wichtig ist auch, dass Sie unten bei Template den Namen parent themes eintragen. In unserem Fall also schlicht “theme1943.

Unter der letzen Zeile kann man dann den individuellen Code einbinden.

Das in diesem Beispiel verwendete Original Template sah ursprünglich so aus:

wordpress childtheme – parent theme

Klicken Sie auf das Bild um zur theme Seite zu gelangen.

Nach zahlreichen Änderungen ist dann diese Seite für unseren Kunden Lucine Schmuck4you geworden:

wordpress childtheme – modifiziertes theme

Klicken Sie auf das Bild um zur Kunden-Seite zu gelangen.

Der Beitrag hat Ihnen gefallen? Dann freuen wir uns über Kommentare und Verlinkungen in Facebook & Co. Gerne erstellen wir Ihnen auf Wunsch auch ein Child Theme für ihr Wunsch-Wordpress Theme.

Hier kommen Sie zu unserem Kontaktformular.

The post WordPress child theme erstellen appeared first on great2gether.

So ich mache es kurz und schmerzlos: Sagen wir mal Sie wollen eine Schriftart auf Ihrer WordPress Seite verwenden, die nicht von Haus aus “dabei ist” – Was machen Sie dann? Richtig – Sie schreiben uns eine E-Mail und wir erledigen das für Sie!

Oder Sie legen in ihrem (aktivierten Theme) einen zusätzlichen Ordner an, den Sie dann “font” nennen. Laden Sie die Schriftarten, die Sie verwenden möchten in diesen Ordner hoch und dann ergänzen Sie ein paar Zeieln in der CSS datei des themes.

In diesem Beispiel werden die Schriftarten Honey Script Light & Honey Script SemiBold eingebunden. In den oberen zeilen wird die Schriftart per URL implementiert und dadrunter dann bestimmten CSS Tags zugewiesen.

Achtung junger Padawan! Wenn die Schriftart wie zum Beispiel hier: PACIFICO-FONT.TTF groß geschrieben wird, dann muss das auch SO (UND NCHT ANDERS KAPIERT?!) eingebunden werden – vom Schriftart Namen bis zum TTF alles groß! Weißte bescheid.

/* Spezial Schrift Honey Script Light */
@font-face {
	font-family: Honey Script Light;
	src: url('../font/honeyscript-light.ttf');
}

/* Spezial Schrift Honey Script SemiBold */
@font-face {
	font-family: Honey Script SemiBold;
	src: url('../font/honeyscript-semibold.ttf');
}

/* Überschriften mit Spezial Schriftart */ 
h1, h2, h3, h4, h5, h6 {
font-family: Honey Script Light;
font-size: 36px;
}

/* Überschriften mit Spezial Schriftart */ 
strong {
font-family: Honey Script SemiBold;
}

Der Beitrag hat Ihnen gefallen? Dann freuen wir uns über Kommentare und Verlinkungen in Facebook & Co. Gerne nehmen wir auch individuelle Anpassungen an Ihrer WordPress Seite vor und freuen uns auf Ihre Anfragen über unseren Kontaktbereich.

The post WordPress Schriftart anpassen appeared first on great2gether.

In diesem Artikel wird erklärt wie man das kostenlose WordPress Newsletter Plugin MailPoet bei WordPress einrichtet.

Es kann über die interne Plugin Suche gefunden uns mit einem Klick installiert werden und danach sind folgende Punkte zu erledigen:

1. Grundeinstellungen & Kontaktangaben
2. Anmelde-Formulare
3. Anmeldebestätigung

1. Grundeinstellungen & Kontaktangaben
Gehen Sie in den Bereich: MailPoet > Einstellungen > Grundlagen und tragen Sie dort mindestens den Link zu Ihrem Impressum und den Datenschutzbestimmungen ein.

MailPoet Newsletter WordPress – Einstellungen

2. Anmelde-Formulare
gehen Sie nun auf den „Anmelde-Formulare“ Es empfiehlt sich das erste Formular in etwas passenden umzubennen. Hier sehen Sie es am Beispiel des offiziellen cliccstar Blog, wo wir den Newsletter parallel zu diesem Beitrag gerade einrichten:

MailPoet Newsletter WordPress – Einstellungen – Forlumare

Wenn Sie nun beim Formular auf Bearbeiten klicken kommen Sie in diesen Bereich, wo Sie ihre gewünschten Formularfelder ergänzen können:

MailPoet Newsletter WordPress – Einstellungen – Formulareinstellungen

Sie können die Elemente per Drag & Drop von rechts nach links verschieben – sehr praktisch.

3. Abonnement-Bestätigung
Im nächsten Reiter passt man unter anderem den Text der Bestätigungsmail an. Tragen Sie einen individuellen Text ein und vergessen Sie auch eine rechtssichere E-Mail Signatur auf keinen Fall.

Hier werden die Einstellungen vorgenommen:

WordPress Newsletter Plugin MailPoet – E-Mail Bestätigung anpassen

So könnte dann in etwa Ihre Mail im Postkasten Ihrer Abonnenten aussehen:

WordPress Newsletter Plugin MailPoet – E-Mail Bestätigungsansicht

Das war eigentlich auch schon das Wichtigste. Der Rest ist nur für die ganz Neugierigen.

The post MailPoet Newsletter Plugin für WordPress appeared first on great2gether.

Advanced Custom Fields ist ein WordPress Plugin das WordPress weitgehend anpassen und für den Nutzer erleichtern kann. Das Einbinden ist jedoch nicht ganz einfach und man muss einige Dinge an den PHP Dateien anpassen. In diesem Beitrag soll einmal gezeigt werden, wie man ein simples Feld in seiner WordPress Seite einbinden kann.

Bevor es losgeht noch 3 Wörter zum Thema was das Plugin eigentlich genau macht: Wenn man zum Beispiel, so wie wir, Webseiten für seine Kunden erstellt kann es vorkommen dass sich nicht jeder Kunde mit Dingen wie HTML, Tabellenerstellung oder ähnlichen, das Webdesign beeinflussenden Dingen, auskennt. So kann man dann alles für den Kunden so vorbereiten, dass er ganichts „kaputt machen“ kann und den Inhalt komplett vom Design trennen.

Nun zum Inhalt dieses Experten Tutorials in Premium Qualität

1. Plugin installieren
2. Felder Gruppen anlegen
3. Ansicht im Backend
4. Inhalte in eine Unterseite einbinden
5. Ansicht im Frontend
6. Weiterführende Links

1. WordPress Tutorial – Advanced Custom Fields, Plugin installieren

Gehen Sie zum Installieren des Plugins wie immer auf den Bereich Plugins > Plugin installieren und geben Sie „Advanced Custom Fields“ im Suchfeld ein. Wenn Sie das hingekriegt haben klicken Sie auf den Installieren Knopf. Achten Sie auch darauf, ob das Plugin kompatibel mit Ihrer Version ist.

WordPress Tutorial – Advanced Custom Fields

2. WordPress Tutorial – Advanced Custom Fields, Felder Gruppen anlegen

Nachdem Sie das Plugin erfolgreich installiert haben sehen Sie auf der linken Seite den neuen Button „Eigene Felder“. Klicken Sie da drauf und dann auf der nächsten Seite auf“Neu erstellen“ Button hinter Felder-Gruppen.

In diesem Beispiel wurde bereits eine Gruppe mit dem Namen Nordic Walking angelegt:

WordPress Tutorial – Advanced Custom Fields – Felder Gruppen

In der Gruppe wurden 7 Felder angelegt die man mit einem Klick auf den Titel der Felder-Gruppe Nordic Walking klickt. Das schauen wir uns jetzt einmal genauer an:

WordPress Tutorial – Advanced Custom Fields – Kurs

Hierzu ein paar Erklärungen…

a) Felder-Gruppen Name: Ganz oben haben wir die Überschrift der gesamten Felder-Gruppe: „Nordic Walking“ – wenn Sie zahlreihe Gruppen anlegen macht es Sinn aussagekräftige Namen zu verwenden. In dieem Beispiel soll ein Termin Bereich auf der Webseite prima-aktiva.de, von unserer lieben Kundin Anja Karweit, erstellt werden. Daher bekommt die Felder-Gruppe also den Namen Nordic Walking.

b) Eigene Felder: Wir sehen insgesamt 7 Eigene Felder – diese kann man per Drag & Drop in der Reihenfolge ändern. Man sieht in der Übersicht, dass jedem Feld immer 4 Dinge zugeordnet sind: Die Position, die Bezeichnung, der Name und der Feld-Typ. Ich rate Ihnen jedes Feld eine Bezeichnung mit dem gleichen Anfangswort zu geben. In diesem Fall wurde hierfür das Wort Kurs verwendet. Wenn Sie eine Bezeichnung eingeben, wird der Name automatisch erstellt – hierzu später noch mehr. Der Feldtyp ist auch sehr wichtig – in der Grundinstallation haben Sie bereits eine große Auswahl unterschiedlicher Feldtypen. Die Liste kann auch durch Plugins von Drittanbietern erweitert werden.

c) Regeln: Hier habe ich festgelegt, dass die Felder Gruppe nur auf der Seite Nordic Walking angezeigt werden soll. Es gibt noch viele andere Optionen zur Auswahl.

d) Optionen: Hier kann man in den gewählten Bereichen (hier: auf der Nordic Walking Seite) bestimmte Funktionen ausschalten, damit man sich im Frontend nicht mit unwichtigen Dingen rumzuschlagen braucht. So kann man zum Beispiel das ganze normale Bearbeitungsfeld ausblenden. In unserem Beispiel wurden keine Bereiche deaktiviert.

Und hier seht ihr noch einmal die einzelnen Felder mit allen individuellen Einstellungen:

WordPress Tutorial – Advanced Custom Fields – Einzelne Felder

3. WordPress Tutorial – Advanced Custom Fields, Ansicht im Backend

So jetzt schauen wir uns einmal an, wie das ganze dann im Backend aussieht. Diese Felder sind wie gesagt nur im Bearbeiten Bereich der Seite Nordic Walking zu sehen:

WordPress Tutorial – Advanced Custom Fields – Backend Ansicht

All diese Sachen sieht man jedoch nur im Backend, während sich im Frontend nichts ändert, bevor man den Code der page.php Datei des WordPress (Child-) Themes anpasst. Hierzu mehr im nächsten Punkt…

4. WordPress Tutorial – Advanced Custom Fields, Inhalte in eine Unterseite einbinden

Nachdem ich mich eipaar Stunden eingelesen habe, habe ich folgenden Code verwendet um diese Inhalte im Frontend (ausschließlich auf der Nordic Walking Seite) einzubinden. Moment! Erst einmal muss man wisssen, wo der Code reinkopiert wird. In der page.php Datei meines Childthemes kommt der Code nach der letzen Zeile dieses CODE-Schnipsels rein:

<?php
/**
 * Theme Page Section for our theme.
 *
 * @package ThemeGrill
 * @subpackage Accelerate
 * @since Accelerate 1.0
 */
?>

<?php get_header(); ?>

	<?php do_action( 'accelerate_before_body_content' ); ?>

	<div id="primary">
		<div id="content" class="clearfix">
			<?php while ( have_posts() ) : the_post(); ?>

				<?php get_template_part( 'content', 'page' ); ?>

				<?php
					do_action( 'accelerate_before_comments_template' );
					// If comments are open or we have at least one comment, load up the comment template
					if ( comments_open() || '0' != get_comments_number() )
						comments_template();
	      		do_action ( 'accelerate_after_comments_template' );
				?>

			<?php endwhile; ?>

Nach dieser Zeile binde ich dann den entscheidenden Code ein:

 <!-- Anpassung ADVANCED CUSTOM FIELDS FELD FÜR NORDIC WALKING SEITE -->
                    <?php if(is_page('nordic-walking')){ ?> <!-- Nur auf der Unterseite Nordic Walking zu sehen! -->
                        <div class="walking-termin">
                            <h3><?php _e('Nächster Termin für einen Kompaktkurs'); ?>: <?php the_field('kurs_termin'); ?></h3>
                            <table>
                                <tr>
                                    <td><?php _e('<strong>Uhrzeit</strong>'); ?>: </td>
                                    <td><?php the_field('kurs_uhrzeit'); ?></td>
                                </tr>
                                <tr>
                                    <td><?php _e('<strong>Anmeldung</strong>'); ?>: </td>
                                    <td><?php the_field('kurs_anmeldung'); ?></td>
                                </tr>
                                <tr>
                                    <td><?php _e('<strong>Kosten pro Termin à 3 Std.</strong>'); ?>: </td>
                                    <td><?php the_field('kurs_gebuhr'); ?></td>
                                </tr>
                                <tr>
                                    <td><?php _e('<strong>Nächste Haltestelle</strong>'); ?>: </td>
                                    <td><?php the_field('kurs_haltestelle'); ?></td>
                                </tr>
                                <tr>
                                    <td><?php _e('<strong>Treffpunkt</strong>'); ?>: </td>
                                    <td><?php the_field('kurs_treffpunkt_adresse'); ?></td>
                                </tr>
                            </table>
                        </div>
                        <!-- Google Map Einbinden -->
                        <div class="walking-map">
                            <?php
                            $location = get_field('kurs_treffpunkt_googlemap'); // VARIABLE FÜR GOOGLE MAP AUS ACF = kurs_treffpunkt
                            if( ! empty($location) ):
                            ?>
                            <div id="map" style="width: 100%; height: 350px;"></div>
                            <script src='http://maps.googleapis.com/maps/api/js?sensor=false' type='text/javascript'></script>
                            <script type="text/javascript">
                            //<![CDATA[
                                    function load() {
                                    var lat = <?php echo $location['lat']; ?>;
                                    var lng = <?php echo $location['lng']; ?>;
                            // coordinates to latLng
                                    var latlng = new google.maps.LatLng(lat, lng);
                            // map Options
                                    var myOptions = {
                                    zoom: 16,  // ZOOOOOOOOOOM!!!!!
                                    center: latlng,
                                    mapTypeId: google.maps.MapTypeId.ROADMAP
                            };
                            //draw a map
                                    var map = new google.maps.Map(document.getElementById("map"), myOptions);
                                    var marker = new google.maps.Marker({
                                    position: map.getCenter(),
                                    map: map
                            });
                            }
                            // call the function
                            load();
                            //]]>
                            </script>
                            <?php endif; ?>
                        </div>    <!-- Ende view 1 -->
                        <!-- Ende Google Maps -->
                    <?php } ?>  <!-- ENDE: Nur auf der Unterseite Nordic Walking zu sehen! -->
                    <!-- Ende Anpassung -->

Das sieht auf den ersten Blick etwas kompliziert aus, daher ein paar Kurze Erklärungen:

a) Anzeige nur auf einer bestimmten Seite: Der ganze Code ist umschlossen von der Anweisung, dass die Inhalte nur auf der Seite nordic-walking angezeigt werden soll.

<?php if(is_page('nordic-walking')){ ?><!-- Nur auf der Unterseite Nordic Walking zu sehen! -->
ACF Code...
<?php } ?>  <!-- ENDE: Nur auf der Unterseite Nordic Walking zu sehen! -->

b) Einbindung der Felder-Variablen: Die zuvor definierten Variablen bzw. Namen der Felder bindet man auf diese Weise ein:

<?php the_field('kurs_uhrzeit'); ?>

– man kann das, so wie wir, in eine Tabelle einbinden oder auch in einen div Bereich. Hier hat man die volle Bandbreite von CSS zur Auswahl. In unserer Tabelle werden rechts die Variablen ausgegeben, die man im Frontend eingibt. Auf der linken Seite stehen die Titel, welche im Frontend NICHT angepasst werden können. Ganz oben ist auch noch einmal die Variable aus dem Kalender Feld in einer grossen Überschrift eingebunden:

 <h3><?php _e('Nächster Termin für einen Kompaktkurs'); ?>: <?php the_field('kurs_termin'); ?></h3>

c) Einbindung einer Google Map: Weiter unten wird es knifflig. Wer nicht unbedingt eine Google Map benötigt kann diesen Teil ignorieren. Das Wichtigste ist diese Zeile:

$location = get_field('kurs_treffpunkt_googlemap'); // VARIABLE FÜR GOOGLE MAP AUS ACF = kurs_treffpunkt

Hier muss die Variable der Gogle Map aus dem Plugin eingebunden werden. Man kann die Höhe der Map anpassen und auch den Zoom einstellen. Genau da an der Stelle, wo ganz dezent ZOOOOOOOOOM!!!! steht. Je größer die Zahl desto näher wird an den Ort gezoomt.

5. WordPress Tutorial – Advanced Custom Fields, Ansicht im Frontend

Und jetzt schauen wir und zum Schluss das ansehnliche Ergebnis im Frontend an und klopfen uns nach erfolgreicher Operation auf die Schultern.

WordPress Tutorial – Advanced Custom Fields – Frontend Ansicht

6. Weiterführende Links
A) Kommentar, Erklärung und Code-Schnipsel zum Thema:
http://www.holgerkoenemann.de/mit-dem-advanced-custom-fields-plugin-wordpress-als-richtiges-cms-nutzen/
B) Der perfekte Code um die Google Map einzubinden:
https://wordpress.org/support/topic/advanced-custom-fields-display-google-map-on-your-theme
C) Anfänger Tutorial samt Anleitung zum Einbinden:
http://code.tutsplus.com/tutorials/getting-started-with-advanced-custom-fields–cms-22126

The post WordPress Profi Tutorial – Advanced Custom Fields appeared first on great2gether.

WooCommerce Sprachdateien manuell installieren – Vorwort:

Wer mit WooCommerce einen mehrsprachigen Shop betreiben möchte könnte schnell Probleme bekommen. Aber kein Problem, hier kommt schon dieser Artikel. WooCommerce ist ein mächtiges Shop-Plugin für WordPress und kann in allen möglichen Sprachen betrieben werden. In den meisten Fällen ist das gerade bei der deutschen Version kein Problem – Manchmal werden aber insbesondere die Buttons nicht übbersetzt. In solchen Fällen empfiehtl es sich die Sprachdateien manuell zu installieren.

WooCommerce Sprachdateien – Download Link

Sprachdateien bekommt ihr hier:
https://github.com/woothemes/woocommerce-language-packs/commits/master
Ihr müsst euch einloggen und dann bei der jeweiligen Datei (z.B.: de_DE.zip) auf den RAW Button klicken um die Dateien runterzuladen. Die .mo & .po Dateien müssen vor dem Upload noch entpackt werden!

WooCommerce Sprachdateien – Upload Pfad

Die ladet ihr dann in dieses Verzeichnis hoch:
http://deinewebseite.de/wp-content/plugins/woocommerce/i18n/languages

WooCommerce Sprachdateien – Permalink Anpassung

und dann läuft das eigentlich auch schon… aaaaber es kann auch passieren, dass jetzt auf einmal die Links im Shop nicht mehr funktionieren. Diesbezüglich kann ich euch empfehlen einmal im Bereich: Einstellungen > Permalinks > Product permalink base reinzuschauen und die Einstellung von Default auf etwas anderes abzuändern. Bei mir hat es zum Beispiel ganz gut mit: „Shop base with category“ funktioniert.

Wenn ihr abspeichert wird daraus dann jedoch, wie in diesem Screenshot zu sehen, „Custom Base“ – also wundert euch nicht.

The post WooCommerce Sprachdateien manuell installieren appeared first on great2gether.

Seit einiger Zeit ist Shopware 5 zum Download verfügbar – in diesem Artikel möchte ich euch zeigen wie ihr die kostenlose Community Edition auf eurem Server installiert.

Zum Inhalt:

1. Einleitung
2. Systemvoraussetzungen
3. Download
4. Sprache wählen
5. Systemvoraussetzungen
6. Lizenz
7. Datenbank verbinden
8. Datenbank füllen
9. Lizenz auswählen
10. Konfiguration
11. Herzlichen Glückwunsch

1. Shopware 5 Installation – Einleitung

Wer oder was ist eigentlich Shopware 5? Es ist natürlich die Weiterentwicklung von Shopware 4. Dieses Shop umfangreiche Shopsystem durften wir bereits zahlreichen Kunden installieren, die auch größtenteils sehr zufrieden sind.

Hier noch ein Wort speziell zur Community Edition:

„Die Community Edition ist die kostenlose Open Source-Version von Shopware und unter AGPL lizenziert. Sie eignet sich für technisch versierte Kunden, die trotz geringem Budget professionell in das eCommerce-Geschäft einsteigen und trotzdem nicht auf eine ausgereifte Basis verzichten wollen.“

Das heißt wenn Sie Plan von der Materie oder einen guten Webmaster haben, können Sie sich die Shopware Community Edition installieren oder installieren lassen.

2. Shopware 5 Installation – Systemvoraussetzungen

Testet bitte ob euer Server / Webspace alle erforderlichen Voraussetzungen erfüllt. Unter folgendem Link erfahrt ihr weitere Einzelheiten zum Thema: Shopware 5 Systemanforderungen. Wenn ihr euch mit den einzelnen Sachen nicht so gut auskennt, könnt ihr auch einfach die Dateien hochladen und bekommt dann während dem Installationsprozess angezeigt ob alle Anforderungen erfüllt sind.

Noch eine Sache vorab: Bevor ihr euren laufenden Shop löscht und voreilig die 5er Version hochladet, solltet ihr auch sichergehen, dass eure verwendeten Plugins auch bereits mit der neusten Version kompatibel sind.

3. Shopware 5 Installation – Download

Die neuste Shopware Version bekommt ihr über die offizielle Shopware Webseite: Shopware Community Edition, kostenlos runterladen.

Shopware 5 Installation – Tutorial – Download

Wenn ihr die Datei runtergeladen habt, muss die Zip Datei entpackt und per FTP Programm (z.B.: Filezilla) im binären Modus auf den Server geladen werden. Je nachdem wie schnell euer Internet ist, kann das eine Weile dauern, da schließlich knapp 10.000 Dateien (!) hochgeladen werden.

4. Shopware 5 Installation – Sprache wählen

Ok dashier sollte jeder schaffen: Nachdem ihr alle Datien hocgleaden habt werdet ihr zunächst aufgefordert die Sprache (für den Isntallationsprozess) auszuwählen. Ihr habt die Wahl zwischen deutsch, englisch und seit neustem auch niederländisch.

Shopware 5 Installation – Tutorial – Installationssprache

5. Shopware 5 Installation – Systemvoraussetzungen

Wenn Sie bei diesem Schritt der Shopware 5 Installation alle Punkte grün angezeigt bekommen, dann sind Sie auf dem besten Weg einen gut funktionierenden Onlineshop zu installieren:

Shopware 5 Installation – Tutorial – Systemvoraussetzungen

Sollten Sie Fehler angezeigt bekommen, empfehle ich Ihnen sich mit Ihrem Webhoster in Verbindung z usetzen. In unserem Beispiel installieren wir Shopware 5 auf einem Server von Hosteurope mit PHP 5.5 und haben zusätzlich 2 Werte angepasst im Bereich KIS > Skripte > Skripteinstellungen:

Shopware 5 Installation – Tutorial – Skripteinstellungen

6. Shopware 5 Installation – Lizenz

Wie bei jeder Software Installation müssen Sie auch bei Shopware den Lizenzbedingungen zustimmen. Lesen Sie sich alles in Ruhe durch und klicken Sie danach auf „Weiter“. Achten Sie dabei darauf, dass das Häkchen gesetzt ist.

Shopware 5 Installation – Tutorial – Lizenz

7. Shopware 5 Installation – Datenbank

Im nächsten Schritt geben Sie die Zugangsdaten zu Ihrer MySQL Datenbank ein. In den meisten Fällen sind der DB-Name, der DB-Benutzer Name und das DB-Passwort bereits ausreichend. Bei einigen Anbietern ist es auch notwendig zusätzlich den Datenbank Server anzugeben. Bei unserer Testinstallation auf einem Hosteurope Server, war dies jedoch nicht notwenig.

Shopware 5 Installation – Tutorial – Datenbank

8. Shopware 5 Installation – Datenbank füllen

Nachdem die Datenbank-Zugangsdaten eingegeben wurden wird die Datenbank als nächstes mit den Grundinformationen gefüllt. Klicken Sie hierfür den blauen Start Button aus dem Screenshot:

Shopware 5 Installation – Tutorial – Datenbank erstellen

Nachdem ihr auf Start gedrückt habt werden 2 Schritte durchgeführt: Zunächst wird die Shopware 5 Datenbank Struktur erstellt…

Shopware 5 Installation – Tutorial – Datenbank erstellen 2

… und danach passiert eigentlich genau das gleiche aber es wird halt in 2 Schritte unterteilt. Naja, wo da der Sinn liegt weiß ich jetzt gerade auch nicht. Seis drum:

Shopware 5 Installation – Tutorial – Datenbank erstellen 3

Sobald diese 2 Schritte fertig geladen haben, könnt ihr wieder weiter klicken:

Shopware 5 Installation – Tutorial – Datenbank erstellen 4

9. Shopware 5 Installation – Lizenz auswählen

Sofern ihr die kostenlose Community Edition von Shopware 5 installieren möchtet, müsst ihr einfach nur auf „Weiter“ klicken und die Party kann beginnen.

Shopware 5 Installation – Tutorial – Community Edition

10. Shopware 5 Installation – Konfiguration

So jetzt sind wir auch schon fast schon fertig. Hier müssen noch ein paar Dinge eingegeben werden, die wohl mehr als selbsterklärend sind. Wer trotzdem noch eine Frage hat, kann diese gerne in die Kommentare schreiben.

Shopware 5 Installation – Tutorial – Konfiguration

11. Shopware 5 Installation – Herzlichen Glückwunsch

Sie haben alles korrekt gemacht? Wenn ja, werden Sie von folgender Nachricht beglückwunscht und können sich nun an die weitere Konfiguration im Backend Bereich machen oder schonmal einen Blick aufs Frontend werfen:

Shopware 5 Installation – Tutorial – Erfolg

The post Shopware 5 Installation – Tutorial appeared first on great2gether.

Nicht-Responsive Tabellen können einem schnell das responsive Webdesign kaputt machen und sorgen für ein unschönes Gesamtbild und schlechte Usability. Daher möchte ich euch einmal zeigen wie man responsive Tabellen ziemlich einfach anlegt um die genannten Punkte zu vermeiden.

Hierfür möchte ich ich 2 Beispiele aufzeigen:

1. Responsive Tabellen mit CSS
2. Responsive Tabellen mit CSS und „Spezial Code“

1. Responsive Tabellen mit CSS

Das gewünschte Ergebnis:

Der HTML Code für genau diese responsive Tabelle:

<table class="tabelle-responsive">
<thead>
<tr>
<th>Land</th>
<th>Hauptstadt</th>
<th>Sprache</th>
</tr>
</thead>
<tbody>
<tr>
<td data-label="Land">Deustchland</td>
<td data-label="Hauptstadt">Berlin</td>
<td data-label="Sprache">Deutsch</td>
</tr>
<tr>
<td data-label="Land">Dänemark</td>
<td data-label="Hauptstadt">Kopenhagen</td>
<td data-label="Sprache">Dänisch</td>
</tr>
<tr>
<td data-label="Land">Türkei</td>
<td data-label="Hauptstadt">Ankara</td>
<td data-label="Sprache">Türkisch</td>
</tr>
</tbody>
</table>

Und der zugehörige CSS Code für die responsive Tabelle:

.tabelle-responsive table {
	display: table;
	border: 1px solid silver;
	border-collapse:collapse;
	width: 100%;
}

.tabelle-responsive table, td, tr, th {
	border-collapse: collapse;
	text-align: left;
}

.tabelle-responsive td, tr, th {
	padding:1em;
        vertical-align: middle;
}

.tabelle-responsive th {
	background:#eee;
	font-weight: bold;
}

Und hier ist noch Code für kleineren Größen (ab 480px und kleiner):

@media only screen and (max-width: 480px) {
    /* responsive Tabelle anpassen */
    .tabelle-responsive table, tr, td {
        padding:0;
        border:1px solid black;
    }
    .tabelle-responsive table {
            border:none;
    }
    .tabelle-responsive thead {
            display:none;
    }
    .tabelle-responsive tr {
            float: left;
            width: 100%;
            margin-bottom: 2em;
    }
    .tabelle-responsive td {
            float: left;
            width: 80%;
            padding:1em;
    }
    .tabelle-responsive td::before {
            content:attr(data-label);
            background: #eee;
            border-right:2px solid black;
            width: 36%;
            float:left;
            padding:1em;
            font-weight: bold;
            margin:-1em 1em -1em -1em;
    }
}

2. Responsive Tabellen mit CSS und „Spezial-Code“

Das gewünschte Ergebnis:

Der HTML Code zum Kopieren:

<div class="table">
<div class="table-row">
<div class="table-cell thead">Deutschland</div>
<div class="table-cell">Berlin</div>
<div class="table-cell">Deutsch</div>
</div>
<div class="table-row">
<div class="table-cell thead">Dänemark</div>
<div class="table-cell">Kopenhagen</div>
<div class="table-cell">Dänisch</div>
</div>
<div class="table-row">
<div class="table-cell thead">Türkei</div>
<div class="table-cell">Istanbul</div>
<div class="table-cell">Türkisch</div>
</div>
</div>

der dazugehörige CSS Code für die Desktop Ansicht:

.table {
	display: table;
	border-collapse:collapse;
	width: 100%;
        border: none !important;
}

.table-row {
	display: table-row;
}

.table-cell {
	display: table-cell;
	border: 1px solid silver;
	padding: 15px;
        vertical-align: middle;
}

.thead {
	font-weight: bold;
	background:#eee;
}

und dieser Code hier ist für die mobile Ansicht:

@media only screen and (max-width: 480px) {
 
    .table {border:none;}
    .table-row {
        display: block;
        border-bottom: 1px solid silver;
    }
    .table-cell {
        display: block;
        -moz-border-bottom-colors: none;
        -moz-border-left-colors: none;
        -moz-border-right-colors: none;
        -moz-border-top-colors: none;
        border-color: silver silver -moz-use-text-color;
        border-image: none;
        border-style: solid solid none;
        border-width: 1px 1px medium;
        display: block;
    }
    .table-row { margin-bottom: 20px; }
}

Falls am Ende noch ein zusätzliches mysteriöses Feld auftaucht könnt ihr diesen Code verwenden um es auszublenden:

/* gegen den Bug */
p::before {display:none;}

Quellen:
http://www.smashingmagazine.com/2008/08/top-10-css-table-designs/5/
http://blog.kulturbanause.de/2012/06/tabellen-im-responsive-webdesign/
http://www.w3schools.com/bootstrap/bootstrap_ref_css_tables.asp

The post Tutorial – Responsive Tabellen mit CSS mit Beispielcode appeared first on great2gether.

Tutorial: Mailchimp mit WordPress verknüpfen – WordPress ist das beliebteste Content Management System und MailChimp das (wahrscheinlich) beliebteste Newsletter-Versand-System – da liegt es nahe Mailchimp mit WordPress zu verknüpfen udn Formulare in die Seite einzubinden die es erlauben die Adressen von dort aus auf den MailChimp Servern abzuspeichern.

Inhalts Übersicht,
Mailchimp mit WordPress verknüpfen

1. MailChimp Account anlegen
2. E-Mail Adresse bestätigen
3. Liste anlegen
4. Plugin installieren
5. API-Verknüpfung
6. Formular Einstellungen
7. Formular einbinden

MailChimp mit WordPress verknüpfen – Schritt 1: Account anlegen

Besuchen Sie die Seite mailchimp.com und legen Sie einen Account an.

MailChimp mit WordPress verknüpfen – Schritt 2: E-Mail Adresse bestätigen

Rufen Sie Ihre E-Mail Account auf und bestätigen die von MailChimp versendete E-Mail.

MailChimp mit WordPress verknüpfen – Schritt 3: Liste anlegen

Legen Sie eine Liste an. Im Top Menü ist das der 3. Punkt – reinklicken reinlesen (englisch) und dann die Liste anlegen + evtl. vorhandenen Kontakte importieren. Aber Vorsicht: Alle Kontakte müssen die Anmeldung zum Newsletter zuvor durch das Double Opt-In Verfahren bestätigt haben.

MailChimp mit WordPress verknüpfen – Schritt 4: Plugin installieren

Loggen Sie sich auf Ihrer WordPress Seite ein und installieren Sie das Plugin: „Mailchimp for WordPress“ – das geht schnell & problemlos.

Mailchimp für WordPress

MailChimp mit WordPress verknüpfen – Schritt 5: API Verknüpfung

Klicken Sie Links in der WordPress Leiste auf das MailChimp Logo und dann sehen Sie das Feld wo der API Code rein soll und auch den Link, der Sie an die Stelle führt, wo man den API Scclüssel bekommt. Klicken Sie auf den Link und folgen Sie den Anweisungen.

MailChimp API für WordPress

Wenn Sie sich durchgeklckt haben landen Sie an dieser Stelle hier – drücken Sie den Create a key Button:

Mailchimp API key erstellen

Wenn Sie den Code erstellt haben können Sie es in Ihrer WordPress Seite eingeben und den blauen Änderungen übernehmen Button klicken. Jetzt sollten Sie verbunden sein.

MailChimp mit WordPress verknüpfen – Schritt 6: Formular einbinden

Klicken Sie wieder links auf der Seite auf MailChimp und dann auf Formulare. Es öffnen sich etwa 10 Milliareden Einstellungsmöglichkeiten!

Ne ok jetzt mal im Ernst: Man muß fast nix machen, unten ist die Formular Vorlage, die nicht groß angepasst werden muss. Unten steht – Benutze diesen Shortcode – und dahinter z.B.: [mc4wp_form]

Den oben erwähnten Shortcode kopieren Sie und binden Ihn in die Seite ein, wo das Newsletter-Anmeldeformular angezeigt werden soll. Speichern, aktualsieren – fertig. Für die Newcomer: Der Code muss im Text-Modus des Editors eingegeben werden. Im „Visuell“ Modus klappt das nicht.

Man kann das Formular außerdem auch über den Widgets Bereich im Footer, der Sidebar oder auch im Header (je nachdem an welcher Stelle ihr Theme den Einsatz von Widgets erlaubt) der Seite einbinden. Klicken Sie hierfür auf Widgets und ordnen Sie das entsprechende Widget per Drag & Drop in den gewünchten Bereich (Sidebar, Footer 1, Footer 2, etc.).

MailChimp Widget einbinden

Dann gibt es in diesem Bereich noch ein Häkchen, das gesetzt werden muss, nämlich bei: Listen dieses Formulars abonnieren. Hier wählen Sie die enstprechende Liste aus und schon können Siech die Benutzer Ihrer Webseite in diese Liste, durch ausfüllen des Formulars eintragen.

Tragen Sie sich ein bekommen Sie zunächst eine Bestätigungsmail in englischer Sprache:

MailChimp – E-Mail Bestätigung

MailChimp mit WordPress verknüpfen – Schritt 7: Design & Sprache

Loggen Sie sich auf mailchimp.com ein und gehen Sie in den Bereich: Lists > Signup Forms

MailChimp – Listen Anmeldeformulare

Wenn Sie auf Signup Forms klicken kommen Sie hier raus:

MailChimp – Listen Anmeldeformulare Übersicht

Wenn Sie nun auf das oberste Formular klicken, und dann in der Mitte auf den Translate It Reiter können Sie die Sprache anpassen:

MailChimp – Formular Sprache

Weiterführende Links:
Übersetzung & Gestaltung des Newsletters:
http://www.elmastudio.de/wordpress/newsletter-erstellen-mit-wordpress-und-mailchimp/

The post Tutorial: Mailchimp mit WordPress verknüpfen appeared first on great2gether.

5 Facebook Stream Plugins für WordPress zu finden ist keine große Aktion. 7 kostenlose, und dazu auch vernünftige Plugins zu finden ist eher schwer.

Das Great2Gether Team hat für euch ein paar unter die Lupe genommen und hier das Ergebnis für euch!

Welche Plugins wurden getestet:

1. Facebook wall and social integration
2. Recent Facebook Posts
3. Feed Them Social
4. JSL3 Facebook Wall Feed
5. Custom Facebook Feed

1. Facebook wall and social integration

WordPress – Facebook Stream Plugins

Sagen wir es so: Wer es kostenlos & gut haben will kann direkt zum nächsten Plugin übergehen. In der gratis Edition ist alles sehr abgespeckt und überzeugt nicht wirklich. Anbei ein Screenshot der gratis Edition in Aktion:

WordPress – Facebook Stream Plugins – Screenshot

Wie man sieht ist kein Bild zu sehen etc… so was kann man keinem Bison ins Auge schütten, oder? Also ab zum nächsten Plugin. Die Installation ist dank benötigtem Access Token (für den man extra vorher eine Facebook App anlegen muss) unnötig langwierig und kompliziert. Wer es trotzdem unbedingt haben muss sollte wenigstens die 40$ ausgeben und die Pro Version kaufen.

Die Proversion in Aktion: Klickt auf den Link hier
Diesen komischen Access Token kann man übrigens hier generieren lassen:

Shortcode: mitsol_fbwall_feed_short_code (in eckigen Klammern)
Schulnote: 6-
Schulnote (Pro Edition): 1-

2. Recent Facebook Posts

WordPress – Facebook Stream Plugins – Recent Facebook Posts

Das Plugin „Recent Facebook Posts“ ist ebenfalls als kostenlose oder kostenpflichtige Pro Version erhältlich.

Hier schonmal kommentarlos ein Blick in die Einstellungen.

Was fällt auf? Man muss ein paar Zusatzinformationen (App ID & App Secret) angeben, die man erst bekommt wenn man eine Facebook App für die Seite angelegt hat. Das geht unter: https://developers.facebook.com/ – Wie das genau geht sprengt an dieser Stelle den Rahmen und den Horizont von Nicht-Facebookologen.

Jetzt kommen wir zur Funktionalität und dem Aussehen:
Es funktioniert alles wunderbar und sieht dazu noch gut aus. Das einzige woran man (bei der kostenlosen Version) gespart hat ist, dass nicht der komplette Stream von Facebook gespiegelt wird sondern eben nur die letzten / aktuellen Posts. Die Bilder werden angezeigt, und wenn man sich die Kommentare anschauen möchte wird man auf Facebook geleitet. Das ist alles vertretbar würde ich sagen.

Und hier noch ein Screenshot vom bisher besten Plugin aus der Liste der Facebook Stream Plugins für WordPress:

WordPress – Facebook Stream Plugins – Recent Facebook Posts – Screenshot

Shortcode: recent_facebook_posts (in eckigen Klammern)
Schulnote: 2-
Schulnote (Pro Edition): 1-

3. Feed Them Social

WordPress – Facebook Stream Plugin Feed Them Social

Das Plugin ist ganz nett – hat aber einige Schwächen insbesondere bei nicht englisch-sprachigen Webseiten. Hier ist der Screenshot des Facebook Streams. Übrigens kann man auch den Feed aus anderen Portale mit dem Plugin auslesen / spiegeln lassen.

WordPress – Facebook Stream Plugin Feed Them Social – Screenshot

Wie man sieht steht dort „added a photo“ – dieser Text lässt sich (zumindest in der kostenlosen Version) nicht anpassen. Über den Rest braucht man dann auch nicht mehr reden. Wer eine englische Seite betreibt kann es ja mal ausprobieren, bei mir wird es gerade aussortiert. Einziger Zusatzpluspunkt: Man kann unten noch eine unnötige Likebox in etlichen Varianten aktivieren.

Schulnote: 5-
Schulnote (Pro Edition): 1-

JSL3 Facebook Wall Feed

WordPress – Facebook Stream Plugin – JSL3 Facebook Wall Feed

Ein geniales Plugin, das zwar schon länger nicht aktualisiert wurde, aber trotzdem mehr bietet als die meisten brandaktuellen Plugins. Zur Funktionalität bedarf es wieder einer eigenen Facebook App um an die App ID und den App Secret Code zu gelangen. Auch die Facebook Seiten ID wird benötigt.

Tip: Ändern Sie die Breite des #facebook_status_box div Bereichs auf 100% wenn Sie die Box auf einer Seite oder einem Artikel einbinden.

4. Custom Facebook Feed

Ist ganz nett, aber es werden in der gratis Version keine Bilder angezeigt. Dafür geht die Installation schnell und die Einstellungen sind einfach zu tätigen. Das Pro Plugin mit Foto Funktionen etc kostet 99 $.

The post 5 kostenlose Facebook Stream Plugins für WordPress appeared first on great2gether.

Shopware 5 ist super, da sind wir uns einig. Man kann schon sehr viel mehr im Admin Bereich anpassen aber uns ist das natürlich nicht genug und daher basteln wir uns gerne eigene Themes. Damit wir dafür nicht bei jeder einzelnen Anpassung Dateien hochladen müssen installieren wir uns Shopware 5 auf mit XAMPP einem lokalen Server. Wie wir das genau machen zeigen wir in diesem Tutorial.

Inhaltsübersicht, Shopware 5 lokal installieren:

• Was wird gebraucht
• Was ist XAMPP
• Computer Nutzer
• Shopware 5 downloaden
• Dateien im htdocs Ordner ablegen
• Voraussetzungen prüfen
• Datenbank einrichten

1. Shopware 5 lokal installieren – Was ist XAMPP

XAMPP simuliert kurz gesagt das Internet auf dem lokalen System und macht es möglich PHP Dateien auszuführen ohne im Internet zu sein. Zusätzlich lassen sich auch Datenbanken anlegen die mit den PHP Dateien, wie zum Beispiel bei Shopware 5, verknüpft werden können. So ist es möglich eine Webseite zu erstellen, zu erweitern und zu testen.  Hier kann XAMPP geladen werden: XAMPP runterladen.

2. Shopware 5 lokal installieren – Computer Nutzer

Für die ganz Ordentlichen: Legt euch zur Arbeit an Themes einen neuen Nutzer an. Aus Sicherheitsgründen sollten nie Haupt-Admin User zur Arbeit an einer Webseite verwendet werden. Außerdem kann man den Desktop des zusätzlichen Nutzers optimal zum Arbeiten an Themes einrichten.

3. Shopware 5 lokal installieren – Shopware 5 downloaden

Ohne Shopware 5, keine Shopware 5 Installation – also auf zur Downloadseite. Ist die aktuelle Shopware 5 (Community Edition) Zip-Datei geladen, muss die Datei zunächst entpackt werden.

4. Shopware 5 lokal installieren – Dateien im htdocs Ordner ablegen

Sind die Dateien geladen und entpackt sollte der Oberordner am besten in shopware5 umbenannt und dann im htdocs Ordner abgelegt werden. Dann ist dieser Teil schon geklärt. Jetzt brauchen wir noch eine Datenbank und sollten noch kurz die Voraussetzungen prüfen.

5. Shopware 5 lokal installieren – Voraussetzungen prüfen

Bevor ihr eure Datenbank anlegt solltet ihr zunächst noch prüfen, ob eure XAMPP Installation alle nötigen Voraussetzungen erfüllt. Klickt auf diesen Link: http://localhost/shopware5/ um im 2. Schritt der Installation festzustellen, ob alle Voraussetzungen erfüllt werden. (Um die Seite aufrufen zu können, muss der Apache Server aktiviert sein.)

Als ich es das 1. Mal probiert habe, sah es da noch nicht so gut aus:

Shopware 5 lokal installieren -Voraussetzungen

Problem a) Bei dem oberen roten Block gab es Probleme mit den Zugriffsrechten, weshalb ich die Rechte des htdocs Orders anpassen musste.

Problem b) Dann gab es das Problem, mit dem nicht vorhandenen ionCube Loader, was aber bei lokalen Installationen ohne irgendwelche wilde Plugins auch nicht so wichtig ist. Wer aber einfach lieber bei allen Voraussetzungen einen grünen Balken sehen möchte, kann den Loader nachinstallieren: Zuerst laden wir uns den aktuellen ionCube Loader, passend für unser jeweiliges System, von der offiziellen Seite runter: Offizielle ionCube Seite.

Shopware 5 lokal installieren – ionCube Loader Versionen

Ist die passende Version lokalisiert und geladen, sollten Sie den Anweisungen in der entsprechenden README.txt folgen. Für mich bedeutet das: Ich entzippe die Datei und lade den Ordner mit dem Namen ioncube in die oberste Ebene meines htdocs Ordners. Als nächstes rufe ich die Seite: http://localhost/ioncube/loader-wizard.php auf um das Plugin zu installieren. Mein Apache Server ist hierfür aktiviert, da ich sonst die PHP Datei nicht aufrufen könnte.

Als ich die Seite aufrief wurde ich noch einmal aufgefordert die entsprechende tar.gz Datei herunterzuladen und in folgendem Ordner abzulegen: xamppfiles/lib/php/extensions/no-debug-non-zts-20131226 – ich gehe aber mal davon aus, dass das von Installation zu Installation unterschiedlich ist, wo letztendlich die Dateien abgelegt werden müssen.

Nachdem ich die Dateien (dieses Mal nicht den ganzen Ordner, sondern nur seinen Inhalt) nun im gewünschten Ordner abgelegt habe musste noch die PHP.ini Datei im Ordner xamppfiles/etc angepasst werden – dort habe ich gleich nach der ersten Zeile folgendes eingefügt:

; Zusatz für ionCube Loader
zend_extension = /Applications/XAMPP/xamppfiles/lib/php/extensions/no-debug-non-zts-20131226/ioncube_loader_dar_5.6.so

Übrigens konnte ich die PHP.ini Datei zunächst, aufgrund fehlender Zugriffsrechte, nicht bearbeiten. Um die Datei bearbeiten zu können habe ich ihr temporär erweiterte Zugriffsrechte gegeben.

Die Loader Wizard Datei habe ich danach (ohne den Rest des Ordners) in den htdocs Ordner gelegt und dann unter der Adresse http://localhost/loader-wizard.php erneut aufgerufen. Dort kam nun die Information, dass der ionCube Loader (noch) nicht (ganz) installiert wurde und der Apache Server neu gestartet werden sollte.

Das habe ich dann auch gemacht und wurde mit folgender Meldung belohnt:

Shopware 5 lokal installieren – ionCube Loader installiert

Nach der erfolgreichen Mission habe ich dann auch die soeben aufgerufene Datei wieder gelöscht, da Sie danach ja nicht mehr benötigt wird.

Problem c) memory_limit nur 128 statt 256 MB – In der PHP.ini Datei muss folgende Zeile angepasst werden:

memory_limit=128M

256 eingeben, speichern, dann den Server neu starten – fertig.

6. Shopware 5 lokal installieren – Datenbank einrichten

Öffne zunächst XAMPP und aktiviere MySQL Database und den Apache Web Server. Wird Apache nicht aktiviert kann PHP nicht funktionieren und ohne MySQL funktionieren die Datenbanken nicht. Auf dem Mac sieht das so aus:

Shopware 5 lokal installieren – XAMPP starten

Sind Server und Datenbank aktiviert, kann der Lokale Server unter: http://localhost/ aufgerufen werden. Wenn der Server funktioniert landet man als erstes auf der XAMPP Startseite:

Shopware 5 lokal installieren – XAMPP Startseite

Klickt nun, im Menü ganz rechts, auf phpMyAdmin um zur Übersicht der Datenbanken zu gelangen. Ist das getan öffnet sich ein Fenster wo man links auf den Neu Button klicken kann, um eine neue Datenbank anzulegen. Nach dem Klick auf Neu öffnet sich ein Fenster indem ihr alle vorhandenen Datenbanken angezeigt bekommt und eine neue Datenbank anlegen könnt. Tragt dort links in das Feld den Datenbanknamen ein, z.B.: shopware5 und wählt dann rechts bei Kollation: utf8_general_ci

Shopware 5 lokal installieren – phpMyAdmin Übersicht

Nach dem Klick auf Anlegen erscheint die neue Datenbank auch links in der Liste bei den anderen 4 Datenbanken die schon vorher da standen.

7. Shopware 5 lokal installieren – Eigentliche Installation

Wenn die Dateien abgelegt sind, alle Voraussetzungen erfüllt werden und die Datenbank angelegt ist, kann folgende Adresse aufgerufen werden um den Shop zu installieren: http://localhost/shopware5/ bzw. wenn die Voraussetzungen Seite noch geöffnet und alles grün ist, kann einfach auf Weiter geklickt werden um mit der Installation fortzufahren.

Was jetzt noch passieren kann ist, dass ein Passwort für den root User in phpmyadmin angelegt werden muss um die PHP Dateien an die Datenbank anzubinden.

Hierfür ist folgendes zu tun: Zunächst wird im phpmyadmin Bereich folgende Zeile in die SQL Konsole geschrieben und abgespeichert – das Wort DeinPasswort sollte entsprechend angepasst werden:

SET PASSWORD FOR root@localhost = PASSWORD('DeinPasswort');

Shopware 5 lokal installieren – root Passwort

Als nächstes muss die config.inc.php Datei etwas angepasst werden. Zunächst muss man diese Zeile finden:

$cfg['Servers'][$i]['auth_type'] = 'config';

und dann gegen diese Zeile austauschen:

$cfg['Servers'][$i]['auth_type'] = 'cookie'; // Neuer Type wegen Passwort

ich mache es meistens so, dass ich die alte Zeile „verstecke“ und die neue da drunter kopiere:

// $cfg['Servers'][$i]['auth_type'] = 'config';
$cfg['Servers'][$i]['auth_type'] = 'cookie'; // Neuer Type wegen Passwort

So dann kann man noch einmal den Server starten und danach dann relativ problemlos Shopware 5 lokal installieren. Bei der Datenbank Installation st der User nun root und das Passwort was ihr zuvor angelegt habt.

Alles weitere ist dann wieder identisch wie bei der „normalen“ Shopware 5 Installation, zu der wir auch einen Beitrag geschrieben haben.

Weiterführende Links & Quellen zum Thema Shopware 5 lokal installieren:

Shopware 5 lokal installieren mit MAMP:
http://8mylez.com/blog/shopware-5-lokal-mamp-pro/

Stackoverflow Beitrag zum Thema root User Passwort:
http://stackoverflow.com/questions/12224431/create-a-root-password-for-phpmyadmin

The post Shopware 5 lokal installieren appeared first on great2gether - Werbeagentur aus Köln.

WordPress Import / Export Plugins sollen heute unser Thema sein – in diesem Beitrag möchten wir euch eine kleine aber sehr feine Auswahl an nützlichen Import / Export Plugins präsentieren. Alle Plugins wurden von uns getestet uns bekommen als Schulnote mindestens eine 2.

Wer braucht WordPress Import / Plugins? – Jeder der mit einer WordPress Seite umziehen möchte und keine Lust hat, großartig an den Datenbanken rumzufummeln. Ein echter Gehemtip ist übrigens das letzet Plugin aus dieser Liste, nämlich der Widget Importer & Exporter, bei dem ihr bis auf das letzte Element eurer Beiträge auswählen könnt, was ihr genau exportieren möchtet und was ihr nicht (mehr) benötigt. Also dann – viel Spaß mit diesen genialen und kostenlosen Plugins!

Übersicht: WordPress Import & Export Plugins

1. Customizer Export/Import
2. Widget Importer & Exporter
3. Advance Custom Import and Export

1. WordPress Import / Export Plugins – Customizer Export/Import

Mit diesem Plugin könnt ihr alle Einstellungen aus dem Bereich Design/Anpassen exportieren und importieren. Das ist ziemlich praktisch bei Themes wo man ziemlich viele Einstellungen vornehmen muss – da man mit ein paar Klicks bereits alle Einstellungen übernommen hat. Das Plugin ist leicht zu installieren und ebenfalls leicht zu bedienen.

Import : Export WordPress Plugin – Customizer Export:Import

Ein kleines Geheimnis gibt es bei diesem Plugin auch: Nämlich der Ort, wo man dann letztendlich importiert & exportiert. Hierfür muss man nämlich in den Bereich Design > Anpassen > Export/Import. Ihr könnt euch also die lange Suche in den Einstellungen und bei Werkzeuge sparen…

WordPress – Anpassungen Export Plugin

WordPress – Anpassungen Import und Export Plugin

2. WordPress Import / Export Plugins – Widget Importer & Exporter

Sie haben zahlreiche Widgets verbaut und keine Lust die Inhalte alle einzeln zu übertragen? Dann werden Sie Spaß an diesem Plugin haben.

WordPress Import / Export Plugins -Widget Importer

3. WordPress Import / Export Plugins – Advance Custom Import and Export

Wer einen größeren Blog betreibt kann mit dem WordPress Importer schnell an seine Grenzen kommen, wenn es darum geht eine größere Anzahl von Beiträgen zu importieren & exportieren. Mit diesem Plugin haben wir beispielsweise problemlos über 500 Beiträge von einer WordPress Installation in eine andere übertragen können.

WordPress Import / Export Plugin – Beiträge exportieren

Alle Plugins getestet mit WordPress 4.4.1

The post WordPress Import / Export – 3 hilfreiche Plugins appeared first on great2gether - Werbeagentur aus Köln.

Shopware Entwicklung mit Git – davon habe ich vor ein paar Wochen gelesen, und war gleich neugierig. Seid ihr es auch? Na dann super – Hier geht`s ohne Umwege ans Eingemachte. Mit Git kann man online seinen Code speichern und mit anderen auf hochprofessionelle Artim Team am Code arbeiten. In diesem Beispiel verwende ich den kostenlosen Account von bitbucket und die ebenfalls kostenlose Software SourceTree. Statt BitBucket könnte man auch das bekanntere GitHub nutzen, der Weg ist ähnlich.

Ok auf geht`s – hier ist die grobe Inhaltsübersicht:

– Sourcetree installieren
– Bitbucket Account anlegen
– Repository anlegen
– Bitbucket mit SourceTree verbinden

Shopware Entwicklung mit Git – Sourcetree installieren

Als erstes gehen wir auf die sourcetree Seite und laden uns dort die aktuelle Version runter. Viel Auswahl gibt es nicht und die Installation geht auch zügig und problemlos. Wenn wir das Programm öffnen werden wir nach unserem Login für Bitbucket oder GitHub gefragt, daher sollten wir dort zunächst einen Account anlegen.

Shopware Entwicklung mit Git – Bitbucket Account anlegen

So der 2. Punkt ist auch sehr einfach, wir gehen einfach auf https://bitbucket.org und klicken auf den grünen Get started for free Button um uns einen Account anzulegen. Ist der Account angelegt und die Mail bestätigt könnt ihr loslegen und euer erstes Repository anlegen.

Shopware Entwicklung mit Git – Repository anlegen

Klickt oben im Menü auf Repositories und dann auf Create repository. In diesem Beispiel lege ich ein Repository für unser erstes kommendes Shopware 5 Theme „byoutea“ an. Hier seht ihr die Einstellungen:

Shopware Entwicklung mit Git – Repository anlegen

Shopware Entwicklung mit Git – Bitbucket mit SourceTree verbinden

Wenn ihr bei SourceTree eure Userdaten von Bitbucket eingegeben habt klickt ihr auf Remote und bekommt dann das zuvor angelegte Projekt angezeigt.

Shopware 5 Entwicklung mit Git – SourceTree Anbindung

Klickt einfach mal drauf, dann kann es weitergehen.

Als nächstes wählt ihr den Ordern aus, der verbunden werden soll. In diesem Beispiel habe ich eine Shopware 5 Installation lokal installiert. Im Ordner Themes/Frontend hatte ich einen Ordner namens byoutea den ich kurz auf dem Schreibtisch zwischengeparkt und im eigentlichen Ordner gelöscht habe. Dann habe ich den vorher noch da gewesenen Ordner in SourceTree als Zielpfad definiert. Nach der Aktion war der byoutea Theme Ordner also wieder da, jedoch noch leer.

Shopware 5 Entwicklung mit Git – Lokaler Ordner

Jetzt bekommen wir das Projekt auch im Lokal Tab angezeigt und können unsere eigentlichen Dateien aus dem Ordner byoutea  wieder da rein legen, wo sie hergekommen sind. Wenn ihr gerade mit einem neuen Projekt bei = startet ist das natürlich nicht relevant. Normaaalerweise macht man es so, dass man über die Zeile Zielpfad in den htdocs Ordner navigiert und dort mit einem Klick auf Klone einen neuen Ordner erstellt, in dem später die Dateien gespeichert werden. Zurück zum Geschehen…

So sieht es nun also ungefähr in meinem Frontend Ordner aus:

Shopware 5 Entwicklung mit Git – Dateien im Finder

Was hat sich geändert? Ich bekomme aufgrund der insgesamt 11 Dateien, die ich abgelegt habe, nun eine 11 angezeigt und kann nun den allerersten Upload in mein Repository durchführen. Hierfür klicke ich auf das mit 11 markierte Projekt und bekomme dieses Fenster angezeigt:

Shopware 5 Entwicklung mit Git – Erster Upload

Vor dem ersten Commit wird man aufgefordert einen Usernamen und seine E-Mail Adresse einzugeben.

Shopware 5 Entwicklung mit Git – SourceTree User

Danach können die Dateien in der Liste markiert, und der erste Commit ausgeführt werden. Im Kommentarfeld erscheint nun der Username – schreiben Sie beim ersten Commit: initial commit als Kommentar.

Hat es funktioniert sieht man nun die Liste der Dateien im Bereich Source.

Shopware 5 Entwicklung mit Git – BitBucket Dateien

Und bei SourceTree wird alles grün angezeigt, wenn alles funktioniert hat.

Shopware 5 Entwicklung mit Git – SourceTree nach Commit

Spätere Updates können dann, nach dem Commit & Kommentieren mit dem Push Button hochgeladen werden. Außerdem empfiehlt es sich, zusätzlich Zweige zu den unterschiedlichen Anpassungen anzulegen. Der Ordner, der nun mit BitBucket verknüpft ist, liegt bei mir auch im Ordner meiner lokalen Shopware 5 Installation. So kann ich schnell und einfach das Design anpassen und Änderungen vornehmen die ich dann, wenn ich zufriden bin, in mein Repository hochlade und natürlich kommentiere.

Wenn man einmal damit angefangen hat möchte man es nicht mehr missen, es macht auch ein bißchen süchtig, also seid vorsichtig.

Weiterführende Literatur & Quellen:
Atlassion.com – Einführung in Git & wie man Repositorys anlegt.
https://confluence.atlassian.com/bitbucket/create-a-git-repository-759857290.html
Alternativer Artikel zum Thema:
http://8mylez.com/blog/git-nutzen-fuer-theme-entwicklung/
Codestellen finden:
http://forum.shopware.com/themes-und-design-f101/less-dateien-und-codestellen-finden-mit-firebug-t32546.html

The post Shopware Entwicklung mit Git appeared first on great2gether - Werbeagentur aus Köln.

WordPress verlangt FTP Login bei Plugin (De-) Installation – zumindest jetzt gerade bei mir in diesem Moment und um genau zu sein auf meiner 2 lokalen WordPress Spielwiese.

WordPress verlangt FTP Login bei Plugin Installation – Aufforderung

Sowas ist irgendwie nervig und kann aber insbesondere auf Live-Umgebungen von Kunden-Webseiten ein großes Problem darstellen, da die Suche nach selten verwendeten Passwörtern gerne mal etwas zeit verschlingen kann.

Was ist also zu tun? Ganz einfach befolgt einfach diese gesammelten Tips aus dem Internet:

1. config.php anpassen
2. Datei-Eigentümer anpassen

config.php anpassen

Bewegt euch unfällig in die config.php Datei und kopiert ganz unten folgende Zeile rein:

/* Anpassung G2G - Problem mit FTP Login zur Plugin Installation beheben */
define('FS_METHOD', 'direct');

Diesen Tip habe ich übrigens von Holger Konemann, wer seinen kompletten Beitrag lesen möchte kann hier klicken.

Bei meinem ersten Versuch konnte ich damit jedoch nicht viel anfangen. Dafür bekam ich aber eine Fehlermeldung, die ich noch nie vorher gesehen. Sie lautete:

Das Plugin konnte aufgrund eines Fehlers nicht gelöscht werden: Das Plugin konnte nicht vollständig entfernt werden: akismet/akismet.php.

WordPress verlangt FTP Login bei Plugin Installation – Fehlermeldung

Danach habe ich einen anderen Tip ausprobiert…

Datei Eigentümer anpassen

Wie im Beitrag von ansas-meyer.de empfohlen habe folgende Zeilen im Terminal eingegeben:

cd /path/to/wordpress-installation
find . -exec chown www-data:www-data {} \;

Falls Sie den exakten Pfad zu Ihrer (lokalen) WordPress Installation (auf dem Mac) nicht kennen hilft ein Rechtklick auf den Ordner weiter – hier bekommen Sie nähere Informationen.

WordPress verlangt FTP Login bei Plugin Installation – Ordner-Pfad

So ich hab das also super hinbekommen mit den 2 Zeilen im Terminal… aaaaber das Ergebnis sah zunächst noch ernüchternd aus, nämlich so:

WordPress verlangt FTP Login bei Plugin Installation – Terminal Fehler

Also ab zum nächsten Vorschlag…

Nachdem ich die schönen Fehlermeldungen aus dem 2. Tipp mental verarbeitet hatte, habe ich darunter noch folgende Zeilen eingegeben:

find . -type d -exec chmod 755 {} \;
find . -type f -exec chmod 644 {} \;

Um damit die CHMOD Rechte der Dateien anzupassen. Darauf wurde mir in diesem Fall kein Fehler angezeigt, aber es wurde auch keine Audio Datei mit Applaus Geräuschen abgespielt. Kurz getestet, aber es kam immer noch die gewohnte Fehler-Anzeige:

Das Plugin konnte aufgrund eines Fehlers nicht gelöscht werden: Das Plugin konnte nicht vollständig entfernt werden: akismet/akismet.php.

Also was tun? Ganz einfach: Ab zum nächsten Tip!

Datei Eigentümer anpassen

Auf diesen genialen Tip bin ich ganz von alleine gekommen, daher gibt es keinen Link zur Quelle. Geht einfach auf euren Ordner, macht einen Rechtklick und passt die Zugriffsrechte von Hand an – und das ganze am besten gleich rekursiv, sprich auf alle Unterordner. Im Screenshot fehlt noch die Anpassung beim User everyone – auch hier sollten die Rechte rekursiv auf Schreiben & Lesen gestellt werden.

WordPress verlangt FTP Login bei Plugin Installation – Ordner-Dateirechte

Und was sagt der Plugin-Manager jetzt? Ich sag`s euch:

Das ausgewählte Plugin wurde gelöscht.

So einfach geht das

Achso: Die Zeile in der config.php muss man trotzdem stehen lassen. Die Lösung war bei mir also eine Kombination aus dem ersten Tip und dem dritten.

Ich hoffe mal, dass euch dieser kleine Tipp auch weiterhilft und wünsche euch viel Erfolg. Wer Erfolg hatte und sich revanchieren möchte, oder einfach findet dass wir cool sind, ist herzlich eingeladen unsere Social Media Profile zu besuchen uns sich dort mit uns zu verknüpfen. Vielen Dank.

The post WordPress verlangt FTP Login bei Plugin (De-) Installation appeared first on great2gether - Werbeagentur aus Köln.

Manchmal kann es sein, dass man den Header und die Sidebar seiner DIVI Seite einfach nicht braucht. Wenn man den integrierten DIVI Builder nutzt kann man die Sidebar auch schon recht einfach ausschalten, aber der Header ist immer da.

Wer bei seinem DIVI Child-Theme (für WordPress) auf bestimmten Unterseiten eine Landingpage verwenden und keinen Header und keine Sidebar einbinden möchte geht folgendermaßen vor:

1. Datei anlegen
2. CSS Datei erweitern
3. header.php erweitern

1. Datei anlegen

Legen Sie im obersten Ordner Ihres Child Themes eine Datei mit dem Namen page-template-landingpage.php an. Kopieren Sie dann diesen Inhalt in die Datei:

Erläuterungen:
Der Ausgangspunkt für den Code war der Inhalt der Datei page.php aus dem parent theme.

Zeile 3: Hier wird der Name des Templates festgelegt. Hier sieht man wie es im Admin Bereich (nur auf Seiten und nicht bei Beiträgen) angezeigt wird:

Divi Theme anpassen – Eigene Seiten-Templates

Zeile 9: main-content wurde in main-content-landingpage umbenannt. Mit dieser Maßnahme können wir den Bereich gesondert von der style.css Datei aus gestalten ohne andere Seiten zu verändern (s. unten).

Zeile 17: Der Code für den Blog und die Überschrift wurden entfernt. Da wir auf der Landingpage keine normale Seiten-Überschrift brauchen wurde selbiger entfernt. Was in der Datei geblieben ist, ist lediglich die Anmerkung, dass dort der Code einmal gewesen ist. Es kann also eigentlich auch raus.

Der ganze left-area div Bereich wurde auch komplett entfernt, so dass nun keine Sidebar mehr angezeigt wird.

2. CSS Datei erweitern

Ich habe folgenden Code in der style.css Datei des Child Themes eingefügt:

Erläuterungen:
Zeile 2: Hier wird der Abstand nach oben verringert, der ohne ein Header Menü keine Daseins-Berechtigung mehr hat.
Zeile 6: Hier wurden der Text beeinflusst und die Abstände angepasst.

3. header.php Datei anpassen

Die Sidebar haben wir mit der neu erstellten Datei bereits deaktiviert, was jetzt noch fehlt ist die Entfernung des Headers, samt Logo & Menü.

<script src=“https://gist.github.com/great2gether/56dc51ad672073f2c414.js“></script>

Falls sie noch keine header.php Datei in Ihrem Child Theme angelgt haben, sollten Sie das hetzt nachholen. Einfach die header.php aus dem Divi theme kopieren und in die oberste Ebene des Child Theme orderns ablegen.

Suchen Sie nun den oberen Code aus diesem Schnipsel und fügen Sie dann den unteren Teil darunter ein. Das ist alles.

Hier ist auch noch der Code für ein Seiten-Template MIT Sidebar und OHNE Header:

The post DIVI – individuelle Seiten-Templates anlegen appeared first on great2gether - Werbeagentur aus Köln.

Seit einiger Zeit ist Shopware 5 online und bietet ein paar gute Verbesserungen. Das beste, was Shopware passieren konnte, ist wohl das responsive Webdesign. Die Einkaufswelten wurden erweitert und auch der Code verbessert.

Nachdem wir bei Teil 1 unserer neuen Shopware 5 Beitragssreihe gezeigt haben wie die Shopware 5 Installation funktioniert geht es nun weiter mit den Shopware 5 Einstellungen. Da es 7 Milliarden verschiedene Einstellungen bei Shopware 5 gibt werden wir in diesem Beitrag nur auf die Grundeinstellungen eingehen.

Inhaltsübersicht, Shopware 5 Einstellungen:

1. Service Nummer anpassen (Footer)
2. E-Mail Adressen anpassen (Formulare)
3. Stammdaten eingeben
4. Versandkosten einstellen
5. Shopeinstellungen
6. Zahlungsarten einstellen
7. Artikel-Bewertungserinnerung
8. E-Mail Signatur, Logo & mehr
9. E-Mail Vorlagen
10. Registrierung erzwingen & mehr
11. Meta Tags & mehr
12. Widgets aktivieren
13. PDF Dokumente anpassen
14. Social Sharing Plugin
15. Erweitertes Menü
16. Optimierung der Bildqualität / Bildkomprimierung deaktivieren
17. Topseller deaktivieren
18. Hersteller-Filter deaktivieren
19. Hersteller in Kategorie-Listen ausblenden
20. Artikel Details: Weiterführende Links ausblenden
21. AGB, Widerrufsbelehrung- & Formular als PDF Anhang

Shopware 5 Konfiguration, Schritt 1 – Service Nummer anpassen

Zum warm werden passen wir erst einmal die Service Tel. Nummer an. Das machen wir im Bereich: Einstellungen > Textbausteine. Geben Sie in das Suchfeld „0180“ sehen Sie einen Eintrag. Geben Sie dort die korrekte Nummer ein. Um Kunden Kosten zu ersparen empfehlen wir eine 0800er Nummer zu verwenden.

Shopware 5 Konfiguration – Servicenummer anpassen

Schauen wir uns einmal den Inhalt dieser Zeile etwas genauer an, dann sehen wir, dass da nicht nur die Telefonnummer angezeigt wird, sondern auch per „href“ verlinkt wird. Wenn Sie die Nummer anpassen, achten Sie also darauf, dass Sie den Link / die Nummer im Link auch anpassen.

Sollten Sie einen mehrsprachigen Shop planen sollten Sie die Nummer auch in der englischen Version anpassen. Wenn Sie die Änderungen gespeichert haben müssen Sie im noch den Shopcache leeren, das geht im Bereich: Einstellungen > Caches / Performance > Shopcache löschen.

Wenn Sie einen Schritt weiter gehen möchten und Skype verwenden, können Sie gleich den Skype Button einbinden um einen Chat zu ermöglichen. Um Ihren individuellen Skype Code generieren zu lassen können Sie die Skype Seite besuchen.

Sie haben die Möglichkeit Chat und / oder Anrufe zu akzeptieren. Zusätzlich sollten Sie, insbesondere, wenn Sie Anrufe entgegennehmen möchten Ihre Skype Einstellungen dahingehen anpassen, dass Ihr Status öffentlich angezeigt wird:

Shopware 5 Konfiguration – Skype Status-veröffentlichen

Wenn Sie die Abstände des Buttons stören, können Sie folgende Zeile in Ihrem Template einbinden (ersetzen Sie dabei bozatilla durch Ihren eigenen Skype Usernamen:

#SkypeButton_Call_bozatilla_1 img {
    margin: 0 !important;
}

Vergessen Sie aber nicht den Usernamen anzupassen. Wenn Sie alles richtig gemacht haben, sollte das Ergebnis so aussehen:

Shopware 5 Konfiguration – Skype Button

Ohne die letzte Anpassung hingegen sieht es etwas unsauber aus:

Shopware 5 Konfiguration – Skype Button unsauber

Shopware 5 Konfiguration, Schritt 2 – E-Mail Adressen anpassen

Rufen Sie den Bereich: Inhalte > Formulare auf und passen Sie bei allen Formularen die E-Mail Adresse an.

Shopware 5 Konfiguration – Formular E-Mail Adressen

Shopware 5 Konfiguration, Schritt 3 – Stammdaten eingeben

Besuchen Sie den Bereich: Einstellungen > Grundeinstellungen > Shopeinstellungen > Stammdaten und geben Sie dort alle wichtigen Angaben ein.

Shopware 5 Konfiguration, Schritt 4 – Versandkosten einstellen

Im Bereich: Einstellungen > Versandkosten können Sie die Kosten für den Versand Ihrer Produkte festlegen. Unten müssen noch die Einstellungen für die einzelnen Länder definiert werden. Wenn Sie beispielsweise nur in Deutschland verkaufen möchten, müssen Sie alle anderen Länder deaktivieren. Auch ein paar Zahlungsarten müssen Sie deaktivieren, die in der Standard Konfiguration alle aktiviert sind.

Shopware 5 Einstellungen – Versandkosten-Einstellungen

Übrigens… wenn Sie Ihre Waren alle versandkostenfrei versenden möchten, und auch Produkte unter 10 € anbieten, dann sollten Sie auf jeden Fall den Mindermengenzuschlag deaktivieren. Hierfüf gehen Sie in den Einstellungen auf den Punkt Kundengruppen und passen dort den Mindestbestellwert und den Mindermengenzuschlag an. Setzen Sie am besten beides aus 0.

Shopware 5 Konfiguration – Mindermengenzuschlag

Shopware 5 Konfiguration, Schritt 5 – Shopeinstellungen

Gehen Sie in den Bereich: Einstellungen > Grundeinstellungen > Shopeinstellungen > Shops und prüfen Sie ob alle Angaben korrekt sind. Wenn alles in Butter ist kann es auch schon weiter gehen. Geheimtipp: Wer übrigens zusätzliche Währungen eingegeben und aktiviert hat, muss diese zusätzlich auch in diesem Bereich noch einmal auswählen damit es angezeigt wird.

In diesem Beispiel sieht man ganz genau wo man die Währungen auswählt. Wenn man weitere aktiviert hat, werden die in der Liste angezeigt – in diesem Fall wird nur EUR angezeigt, da ich noch keine zusätzlichen Währungen aktiviert habe. Arbeitet man an einem kleinen Monitor, kann man den Pfeil am Rande des Auswahlfeldes nicht sehen:

Shopware 5 Einstellungen – Währungen

Shopware 5 Konfiguration, Schritt 6 – Zahlungsarten einstellen

Gehen Sie in den Bereich: Einstellungen > Zahlungsarten und deaktivieren alles was Sie nicht brauchen und aktivieren Sie was Sie verwenden werden. Wenn Sie Paypal, Barzahlen oder SOFORT Überweisung nutzen möchten finden Sie dazu detaillierte Anleitungen in unserem Blog.

Shopware 5 Konfiguration, Schritt 7 – Artikel-Bewertungserinnerung

Gehen Sie in den Bereich: Einstellungen > Grundeinstellungen > Storefront > Artikelbewertungen
und schalten Sie die Mails am besten aus. Gesetzlich handelt es sich bei dieser Form von Erinnerung um unerwünschte Werbung und man kann sich unnötigen Stress in Form von Unterlassungsklagen ersparen.

Shopware 5 Einstellungen – Bewertungserinnerung

Shopware 5 Konfiguration, Schritt 8 – E-Mail Signatur, Logo & mehr

Begeben Sie sich in den Bereich Einstellungen > Storefront > E-Mail Einstellungen und geben Sie eine rechtssichere E-Mail Signatur ein. Es sind 2 Felder auszufüllen: E-Mail Footer Plaintext & E-Mail Footer HTML. Achten Sie bei der HTML Version auf die korrekte Formatierung.

Achtung: Im Screenshot steht bei „Double-Opt-In für Newsletter-Anmeldungen“ noch Nein – hier sollten Sie unbedingt JA einstellen. Andernfalls kann es wieder zu Abmahnungen kommen.

Shopware 5 – Einstellungen – E-Mail Einstellungen

Und noch etwas: Wenn ihr ein Childtheme angelegt solltet ihr noch, um euer Logo in die HTML E-Mail-Vorlagen einzubinden, bei E-Mail Header HTML das Wort Responsive gegen den Namen eures Themes austauschen. In diesem Beispiel steht da jetzt z.B. KTH.

Shopware 5 Konfiguration – E-Mail Header Logo

Shopware 5 Konfiguration, Schritt 9 – E-Mail Vorlagen

Gehen Sie in den Bereich: Einstellungen > eMail Vorlagen und passen Sie die Texte an, so wie es Ihnen gefällt. Es gibt jedoch einen Haken an der Sache! Nämlich den, der eventuell bei HTML-Mail gesetzt ist. Sollte dieses Häkchen gesetzt sein (es liegt an Ihnen), dann müssen Sie auch die Texte im HTML-Text Tab anpassen.

Shopware 5 – Einstellungen – E-Mail Vorlagen

Shopware 5 Konfiguration, Schritt 10 – Registrierung erzwingen

Falls Sie, wie die großen Platzhirsche im Business, eine Registrierung der Kunden erzwingen möchten gehen Sie in den Bereich: Einstellungen > Grundeinstellungen > Storefront > Anmeldung / Registrierung und passen sie den Wert bei „Kein Kundenkonto“ deaktivieren an bzw. stellen Sie es aus nein. So kann man in Ihrem Shopware 5 Shop nur einkaufen, wenn man sich auch ein Kundenkonto anlegt.

Schauen Sie sich auch unbedingt die weiteren Einstellungen in diesem Bereich an!

Shopware 5 – Einstellungen – Registrierung erzwingen

Shopware 5 Konfiguration, Schritt 11 – Meta Tags

Gehen Sie in den Bereich Einstellungen > Textbausteine und geben Sie in der Suche das Wort indexmeta ein. Die vier auszufüllenden Felder sie diese hier:

IndexMeta Author: Geben Sie Ihren Namen ein
IndexMetaKeywordsStandard: Geben Sie ca. 10 Suchbegriffe ein (mit Komma getrennt)
IndexMetaDescriptionStandard: Hier geben Sie Ihre Meta Descritopn ein
IndexMetaCopyright: Hier kommt das Copyright rein

Shopware 5 Einstellungen – Meta Tags

Weiter Tipps und Tricks findet ihr unter folgendem Link:
http://community.shopware.com/Shopware-SEO-Guide_detail_1397.html

Shopware 5 Konfiguration, Schritt 12 – Widgets aktivieren

Widgets sind kleine praktische Infofenster die Sie im Backend aktivieren können. Wenn Sie sich das erste Mal in Ihrem Shopware 5 Shop einloggen, sehen Sie schon das (noch leere) Widget Fenster auf der linken Seite. Klicken Sie auf das + Zeichen um ihre gewünschten Widgets zu aktivieren.

Shopware 5 – Einstellungen – Widgets

Shopware 5 Konfiguration, Schritt 13 – PDF Dokumente anpassen

Gehen Sie als erstes in den Bereich Einstellungen > Grundeinstellungen > Shop Einstellungen > PDF Beleg Erstellung. Dort angekommen gehen Sie nun folgende Felder durch und passen die eingetragenen Werte an: Logo, Header Sender, Header_Box_Right & Footer. Nachdem Sie die Rechnung angepasst haben sollten Sie den Eigenschaften für alle Dokumenttypen übernehmen Button klicken. Ihr Logo sollte folgende Größe haben: 255px x 57px – sollten Sie Probleme mit dem Austausch des Logos haben, lesen Sie Punkt 19 unser Beitrags über die Shopware 4 Konfiguration.

Geheimtip: Die Texte des Footers haben Textgröße 1 – ändern Sie das. Textgröße 3 ist schon besser.

Shopware 5 – Einstellungen – PDF Belege

Shopware 5 Konfiguration, Schritt 14 – Social Sharing Plugin

Bei Shopware 4 haben wir noch das Facebook Plugin empfohlen, was seinerzeit das höchste der Gefühle war. Wenn man heute im Backend, im Plugin Bereich danach wird man nicht mehr fündig weil es jetzt wohl über Github zu haben ist. Das ist meiner Meinung nach ein ziemlich komischer Schritt nach hinten zur Kompliziertheit, aber seit neustem gibt es dafür ein anderes, ebenfalls kostenloses und dazu noch besseres Plugin namens „Social Share“ im Backend.

Geht in den Plugin Bereich und gebt dort „Social“ ein, dann wird das Plugin auch schon vorgeschlagen.

Shopware 5 – Einstellungen – Social Sharing Plugin

Wer es isntallieren möchte muss zuvor eine Facebook App anlegen um die App ID eingeben zu können, des weiteren werden die Facebook Fanpage URL und der Twitter Username eingegeben. Dann wird das Plugin noch aktiviert (macht Sinn oder?), das Template kompiliert – und dann läuft das ganze auch recht geschmeidig. Das Ergebnis sieht zudem besser aus, als das alte Facebook Plugin + man hat eben noch Twitter und Google+ dabei. Optimal.

Shopware 5 Konfiguration, Schritt 15 – Erweitertes Menü

Sie haben in Ihrem Shop nicht nur Kategorien, sondern auch Unterkategorien? Dann empfiehlt es sich das erweiterte Menü zu aktivieren. Gehen Sie hierfür in den Plugins Bereich und aktivieren Sie das (bereits vorinstallierte) Plugin.

Shopware 5 – Einstellungen – Erweitertes Menue

Ist es aktiviert öffnen sich die Unterkategorien, wenn man mit dem Mauszeiger über eine (Ober-) Kategorie geht und die Kunden finden so leichter ans Ziel.

Shopware 5 Konfiguration, Schritt 16 – Optimierung der Bildqualität / Bildkomprimierung deaktivieren

Shopware 5 komprimiert beim Upload alle Bilder auf eine geringere Qualität runter. Die Standard-Einstellung liegt bei 90 auf einer Skala von 1-100. Wenn eure Bilder nach dem Upload unsauber erscheinen und ihr euch schon immer gefragt habt woran das liegen könnte: Das wird zu 90% der Grund dafür gewesens sein. Um die Einstellung auf 100 zu stellen geht ihr in den Bereich Inhalte > Medien > Irgendein Album (z.B.: Einkaufswelten) und klickt dann auf das Zahnrädchen neben dem Link zum Album. So gelangt ihr zu den Einstellungen und es öffnet sich folgendes Fenster:

Shopware 5 – Design anpassen – Bildqualitaet

Jetzt könnt ihr die beiden Werte, wo 90 und 60 steht jeweils gegen die 100 austauschen um in Zukunft die volle Bildqualität eurer Dateien beim Upload beizubehalten. Aber: Die Qualität der bereits hochgeladenen Bilder ändert sich nach dieser Einstellung nicht mehr und Bilder die bereits komprimiert wurden müssen erneut hochgeladen werden.

Die Bildqualität hat sich immer noch nicht gebessert? Dann liegt es entweder daran, dass die Bilder zu klein sind und gestreckt werden – da können schon ein paar fehlende Pixel einiges ausmachen. Probiert es mit dem gleichen Bild in 1920px Breite und schaut ob es sich ändert.

Manchmal kann es auch helfen ein Bild per HTML Bild mit dem direkten Link zur Bilddatei einzubinden, hierfür muss der Code aus der Medienübericht in der Detail-Ansicht des Bilds kopiert werden.

Shopware 5 Konfiguration – unscharfe Bilder

Rechts unten sieht man das Feld Adresse – dort kann man den Link zum Bild rauskopieren. Markieren kann man den Link nicht so wirklich, kopieren aber trotzdem.

Shopware 5 Konfiguration, Schritt 17 – Topseller deaktivieren

Wer in den Kategorie Ansichten den Topseller-Slider deaktivieren möchte geht dafür folgenden Weg:

In eurem Childtheme legt ihr die Datei top-seller.less an, der Inhalt lautet:

/* Topseller ausblenden */
.topseller {
    display: none;
}

Die Datei legt ihr dann in diesem Ordner ab:
/euerthemename/frontend/_public/src/less/_modules

Die neue Datei müsst ihr dann zudem mit dieser Zeile in der modules.less einbinden:
@import „_modules/top-seller“;

Nachtrag: Man kann es noch einfacher haben, wenn man ins Backend geht und dann auf Einstellungen und klickt dann auf Caches / Performance. ACHTUNG: Wenn man nicht klickt sondern nur hovert öffnet sich nichts man muss auf den Link Caches / Performance draufklicken.

Dann öffnet sich folgendes Fenster, im Beispiel habe ich schon auf den Reiter ganz rechts (Einstellungen) geklickt und den Punkt Topseller geöffnet:

Shopware 5 Konfiguration – Topseller ausblenden

Hier kann man nun das Häkchen beim Punkt Topseller im Shop anzeigen entfernen und ist damit schon am Ziel. Wenn sich nach dem speichern nichts ändert, sollte noch der Cache gelöscht werden.

Shopware 5 Konfiguration, Schritt 18 – Hersteller-Filter deaktivieren

Wenn Sie in den Kategorie Listen auf „Filtern nach“ klaicken bekommen Sie unterschiedliche Filter-Optionen wie z.B. die Hersteller angezeigt. Wenn Sie aber einen Shop betreiben, in dem der Hersteller eh immer gleich ist können Sie die Anzeige auf 2 Wegen deaktivieren.

mit CSS in ihrem eigenem Theme passen Sie in diesem Ordner:
/themes/Frontend/ihrthemename/frontend/_public/src/less/_modules/

folgende Datei an: global.less – indem Sie diese Zeilen hinzufügen:

.facet--manufacturer {
    display: none;
}

Der einfachere Weg geht über den Admin Bereich. Hierfür (richtig) klicken Sie auf: Einstellungen > Caches / Performance und öffnen damit ein neues Fenster. Gehen Sie dann im Reiter Einstellungen auf den Punkt Filter und entfernen sie das entsprechende Häkchen.

Shopware 5 Konfiguration – Hersteller-Filter deaktivieren

Shopware 5 Konfiguration, Schritt 19 – Service Nummer anpassen

Wenn man den Herstellernamen in den Kategorie-Listen ausblenden möchte, kann man in der global.less Datei folgenden Code ergänzen:

/* CATEGORY LISTING - Hide manufacturer name */
.manufacturer--name {
    display: none;
}

Shopware 5 Konfiguration, Schritt 20 – Artikel Details: Weiterführende Links ausblenden

Jeder kennt diese riesige Überschrift „Weiterführende Links zu …“ und die 2 störenden Links. Wenn ihr auf der Produkt-Detailseite bei der Beschreibung die weiterführenden Links entfernen möchtet, geht ihr so vor: Zunächst einmal muss eine Datei angelegt werden, mit dem Namen description.tpl, diese muss dann in folgenden Ordner:
/euerthemename/frontend/detail/tabs/description.tpl

Und das hier ist der Inhalt:

{extends file='parent:frontend/detail/tabs/description.tpl'}
{* Product - Further links *}
{block name='frontend_detail_description_links'}{/block}

Shopware 5 Konfiguration, Schritt 21 – AGB, Widerrufsbelehrung- & Formular als PDF Anhang

Seit 2014 muss der Kunde bei der Bestellbestätigung zusätzlich einige PDF Dateien als ANhang mitgesendet bekommen, diese sind: AGB, Widerrufsbelehrung- & Formular als PDF Anhang. Zusätzlich empfehlen wir selbige auch schon bei der Registrierungs-Email mit anzuhängen. Wenn Sie keine 7 Mrd. Yen für einen AGB Anwalt haben können Sie sich das gröbste auf agb.de zusammenwürfeln.

Die Anhänge fügen Sie im Bereich Einstellungen > E-Mail-Vorlagen > System-E-Mails bei den entsprechenden Mails hinzu. Es sind gleich die ersten beiden Einträge in der Sparte: sREGISTERCONFIRMATION & sORDER

Shopware 5 Konfiguration – E-Mail Anhänge

Und wenn ihr die Dateien hinzugefügt habt, sollte es dann so aussehen:

Shopware 5 Konfiguration – PDF Anhang

Jetzt werden beim Versand der E-Mails alle benötigten PDF Dateien gleich mitgesendet, auch wenn es so aussieht, als müßte man noch ein Häkchen setzen…

Quellen:
Shopware 5 – Erste Schritte und Tricks:
http://upload-magazin.de/blog/11195-shopware-5/
Shopware 5 – Themes erstellen:
http://8mylez.com/blog/shopware-5-theme-erstellen/
Shopware 5 – Topseller deaktivieren:
http://www.engelmann-software.de/shopware-5-topseller-ausblenden-deaktivieren/
Shopware 5 – Infos aus der Beschreibung entfernen
http://forum.shopware.com/discussion/34715/infos-aus-der-beschreibung-entfernen
Shopware 5 – E-Mail mit Anhang versenden und E-Mail Vorlagen gestalten:
http://community.shopware.com/Bestellabschluss-eMail_detail_51.html

Weitere Beiträge aus unserer Shopware 5 Reihe:
Shopware 5 – Teil 1: Shopware 5 Installation

The post Shopware 5 – Konfiguration / Einstellungen appeared first on great2gether - Werbeagentur aus Köln.

Im 3. Teil unserer Shopware 5 Beitragsreihe zeigen wir euch wie man ein eigenes Shopware 5 Theme anlegt und Anpassungen am Shopware 5 Design vornimmt.

1. Shopware 5 Theme erstellen:

• 1.1 Theme Manager
• 1.2 Vorschaubild
• Header – Cookie Plugin

2. Shopware 5 Theme anpassen – Header

• 2.1 Header – Cookie Plugin

3. Shopware 5 Theme anpassen – Produkt-Detailseite

• 3.1 Produkt-Detailseite – Artikelnummer

1.1 Shopware 5 Theme erstellen: Theme Manager

Gehen Sie in den Bereich: Einstellungen > Theme Manager und klicken Sie dann auf Theme erstellen.

Shopware 5 Konfiguration – Theme erstellen

Wählen Sie als Vorlage auf jeden Fall Responsive, wenn Sie nicht schon ein Diplom in Shopware-Wissenschaften besitzen. Wählen Sie zudem einen Namen, eine Beschreibung sowie Lizenz-Art. Ich empfehle: MIT.

Shopware 5 Konfiguration – Theme erstellen – Details

Wer ganz sauber arbeiten möchte legt sein Theme lokal an, so werden nicht gleich alle möglichen leeren Unterordner mit angelegt.

1.2 Shopware 5 Theme erstellen: Vorschaubild

Wer mag kann noch die preview.png neu anlegen, damit es in der template Auswahl nicht so langweilig aussieht. Die Datei sollte direkt im obersten Verzeichnis des Themes abgelegt werden. So sieht es aus wenn man es nicht macht:

2.1 Shopware 5 Theme anpassen – Header: Cookie Plugin

Wer bei der Installation von Shopware das Cookie Plugin installiert haben, wird eventuell das Bedürfnis verspüren die Hintergrundfarbe anzupassen.

Hierfür können Sie so vorgehen: Legen Sie in Ihrem Theme die Datei „/themes/Frontend/ByouteaTheme/frontend/_public/src/css/byoutea.css“

ByouteaTheme ist hierbei durch Ihren Theme Namen zu ersetzen. Wie die CSS Datei selbst heißt spielt eine geringere Rolle.

Nun zum Inhalt:

 
/* HEADER - Cookie Bar - BG color */
.cookie-bar {
    background: #25beac !important;
}

Und hier das Ergebnis:

Shopware 5 – Theme anpassen – Header – Cookie Hintergrundfarbe anpassen

3.1 Shopware 5 Theme anpassen – Produkt-Detailseite: Artikelnummer

Wer, so wie ich gerade, das Bedürfnis hat den doch sehr riesigen Abstand zwischen dem Wort Artkelnummer und der eigentlichen Nummer zu verringern kann dies auf folgendem Wege erledigen: Zuerst einmal braicht ihr in eurem theme die Datei detail.less – die Datei muss im Ordner a/themes/Frontend/euertheme/frontend/_public/src/less/_modules abgelegt werden und dann noch in der modules.less eingetragen werden.

Der Inhalt der detail.less hingegegen sollte so aussehen:

/* Abstand zwischem dem Wort ARTIKELNUMMER und der eigentlichen Nummer verringern */
.product--details .product--base-info .entry--label {
    width: auto;
}

Die Anmerkung könnt ihr natürlich auch weglassen, wenn ihr Platz sparen wollt. Auf jeden Fall wird dem Feld für das Wort Artikelnummer die Größe nun automatisch und schwer dynamisch zugewiesen. Vorher war die Breite starr auf 35% festgelegt. Woher ich das weiß? Ganz einfach: Ich bin bei der freiwilligen Feuerwehr und ein Arbeitskollege hatte eine Nutoka-Brot dabei.

Shopware 5 Theme erstellen – Produktdetails – Artikelnummer

In dem oberen Screenshot seht ihr wie es vorher war. Anstandhalber soll ein Screenshot der angepassten Version nicht fehlen. Zukünfige Shopware Superstars werfen auch 1-3 Blicke in den CSS Bereich.

Shopware 5 Theme erstellen – Produktdetails – Artikelnummer – nachher

to be continued…

The post Shopware 5 – Shopware 5 Design anpassen appeared first on great2gether - Werbeagentur aus Köln.

Heute bin ich zufällig auf dieses Plugin gestoßen und möchte euch mit diesem Testbericht über die neue Shopware Erweiterung informieren. Schaut am besten mal auf die Seite und guckt euch an, was es genau kann. Kurz gesagt ist es ein Warenwirtschaftssystem, das aber auch noch weitere verkaufsfördernde Funktionen bietet um Shopware zu optimieren.

Ich bin gerade sehr neugierig, was es mit der Zoom-Funktion auf sich hat, da ich mit dem Plugin aus dem Shopware Shop nicht ganz zufrieden bin. Also werde ich einmal die Beta Version installieren und schauen ob es meiner Vorstellung entspricht.

1. Anmeldung & Download
2. Upload & Aktivierung im Plugin-Manager
3. Backend-Ansicht
4. Satz mit X

1. Sellmato – Anmeldung & Download

Die Anmeldung ist unkompliziert und kostenlos. Es gibt eine kostenlose und mehrere kostenpflichtige Versionen, die jedoch auch alle als 90 tägige Beta Version getestet werden können.

Nach der Registrierung kann im Mitglieder Bereich eine Zip Datei geladen werden:

2. Sellmato – Upload im Plugin-Manager

Nach erfolgreichem Download geht es als nächstes in den Shopware Backend Bereich, wo das Plugin hochgeladen wird:

Plugin Upload

Ist das Plugin hochgeladen sieht man es unten in der Liste der deinstallierten Plugins:

Shopware Plugin – Sellmato – Plugin-Liste

Mit einem Klick auf den grünen Button wird das Plugin dann installiert. Zusätzlich habt ihr, im Gegensatz zu allen anderen Plugins die von Haus aus dabei sind, einen zusätzlichen blauen Button, mit dem ihr Updates installieren könnt.

Ist das Plugin installiert muss es im nächsten Schritt noch aktiviert werden:

Shopware 5 Plugin – Sellmato – Plugin aktivieren

3. Sellmato – Backend-Ansicht

Wenn Sie das Plugin hochgeladen, installiert und aktiviert haben müssen Sie im letzten Schritt einmal den Backend Bereich aktualiseren, da man sonst den neuen Link noch nicht sehen kann. Wenn Sie Ihren Brwoser aktualisiert haben sehen Sie im Haupt Admin-Menü einen neuen Link.

Shopware 5 Plugin – Sellmato – Backend Link

Klickt man auf den Link kann man zwischen Konto & Modul-Manager wählen. Geht man auf den Manager erwartet einen folgendes Szenario:

Shopware 5 Plugin – Sellmato – Module

4. Sellmato – Satz mit X

Hier können nun also die gewünschten Module aktiviert und ausprobiert werden. Mein einziges Problem: ich sehe kein Artikel-Zoom Plugin… Anfangs hatte ich in den Plugin Update Einstellungen Beta eingestellt und die Liste war noch kleiner. Bei Stable und Development ist die Auswahl größer.

Shopware 5 Plugin – Sellmato – Plugin Update Kanal

Dann ist mir noch aufgefallen, dass es ein Update gibt – auch nach dem Update konnte ich kein Artikel-Zoom Plugin ausfindig machen. So sehr ich glaube, dass Sellmatic viel Potenzial hat, bin ich jetzt erst einmal enttäuscht…

… Auf dem Blog habe ich gelesen, dass man zunächst einmal eine Beta Lizenz freischalten muss, wofür vorher alle Kundendaten samt Bankdaten benötigt werden. Aud Shopware 5.0.4 habe ich es garnicht zum Laufen bekommen mit 5.1.4 hingegen hat es geklappt. Doch auch nach diesem Schritt konnte ich das versprochnene Zoom Plugin nicht ausfindig machen.

Also habe ich alles wieder deinstalliert, mein altes Zoom Plugin reaktiviert und festgestellt dass es dort ein paar Einstellungen gibt die mein Problem auch halbwegs lösen. Es ist nicht perfekt aber wesentlich besser.

So und jetzt wird gleich mal wieder dieser Vertrag für die Beta Version gekündigt, damit man nicht am Ende noch 149.- € / im Monat für ein Warenwirtschaftssystem zahlt – obwohl man nur ein Artikel-Zoom Plugin für die Listen gesucht aber nicht gefunden hat…

Die Warenwirtschaftssystem Funktionen selbst habe ich bisher nicht getestet.

Benutzt Ihr das Plugin selber auch? Wenn ja – Welche Erfahrungen habt ihr gemacht?
Wir freuen uns auf euer Feedback, bezüglich dieses spannenden Plugins!

Weiterführende Links:

Die kostenlose Sellmato Lagerverwaltung für Shopware im Detail

Heute startet die Sellmato Beta

The post Shopware Erweiterung: Sellmato Warenwirtschaft appeared first on great2gether - Werbeagentur aus Köln.

Vielleicht verwenden einige von euch da draußen die Staffelpreis-Funktion von Shopware 5. Und vielleicht habt ihr euch schon einmal darüber gewundert warum beispielsweise in den Listen bei den „ab“ Preisen sind der günstigste Preis der Staffelung sondern stattdessen der teuerste angezeigt wird.

Wenn ihr also zum Beispiel ein Produkt anbietet, das einzeln 100 € ab 10 Stk. 90 € und ab 25 Stk. nur noch 80 € kostet wird in den Shopware 5 Listen dann nicht „ab 80 €“ sondern „ab 100 €“ angezeigt. Das macht natürlich viel Sinn, daher ist es sinnvoll folgende Einstellung vorzunehmen: Gehen Sie in den Bereich Grundeinstellungen > Storefront > Kategorien / Listen

In diesem Bereich findet man an unterster Stelle den Punkt Staffelpreise in der Günstigsten Preis Berechnung berücksichtigen. Wählen man dort nun Ja statt nein aus sollte alles korrekt angezeigt werden.

Sollte sich im Frontend nichts ändern, geht ihr auf Einstellungen > Caches / Performace > Shop cache leeren und aktualisiert danach euren Shopware 5 Shop.

Shopware 5 – Staffelpreise in Listen

Weiterführende Links:
Shopware Forum Beitrag zum Thema:
http://forum.shopware.com/discussion/28187/ab-preise-teuerster-preis-bei-staffelpreisen

P.S.: Wem der Beitrag weitergeholfen hat ist herzlich eingeladen unsere Social Media Kanäle zu besuchen und unsere Seiten zu abonnieren. Ihr habt Probleme mit eurer Shopware Installation, oder möchtet einen Shop neu installieren lassen? Dann meldet euch über unser Kontaktformular – wir freuen uns auf eure Anfragen.

The post Shopware 5 – Den kleinsten Staffelpreis anzeigen lassen appeared first on great2gether - Werbeagentur aus Köln.

WordPress Cookie Plugins gehören zu den essentiellen Plugins die bei keiner WordPress Installation fehlen dürfen. Leider habe ich bis heute noch nicht das 100% perfekte Plugin gefunden, mal passt dieses nicht und mal passt jenes nicht – daher springe ich also meistens zwischen 3 verschiedenen Plugins hin und her.

WordPress Cookie Plugins – Warum und weshalb?

Ganz einfach: Es ist Pflicht. Nungut… nicht ganz, an sich ist es eine EU Richtlinie, die von Deutschland noch nicht umgesetzt wurde. Diese Richtlinie verpflichtet Webseiten-Betreiber Cookies nur zu aktivieren, wenn der Webseiten-Besucher dieser Nutzung ausdrücklich zugestimmt haben.

Was aber in Deutschland gilt ist der § 15 Abs. 3 des Telemediengesetzes. Dieser besagt, dass der Nutzer zumindest über die Nutzung von Cookies unterrichtet und auf ein Widerspruchsrecht hingewiesen werden muss. All das kann jedoch auch in der Datenschutzerklärung stehen. (Sprich: Theoretisch könnte man auch ganz auf WordPress Cookie Plugins verzichten und es nur im Datenschutz Bereich erwähnen.)

Um diese verwaschene Richtlinie einzuhalten gibt es nun 3 Möglichkeiten.

1. Möglichkeit: Für die lockeren Typen
Verzichten Sie einfach auf das WordPress Cookie Plugin. Für Sie reicht es die Info in den Datenschutzbestimmungen zu erwähnen. Für die Erstellung von Datenschutzbestimmungen empfehlen wir den Online-Datenschutz-Generator von e-recht24.de – der ist zwar kostenlos, aber für lockere Typen reicht das.

2. Möglichkeit: Für die Mittelweg Menschen
Sie informieren Ihre Nutzer nicht nur in den Datenschutzbestimmungen über die Verwendung von Cookies und das Widerspruchsrecht, sondern auch beim ersten Aufruf der Webseite.

3. Möglichkeit: Für die ganz peniblen WordPress-Webmaster
Wer auf Nummer sicher gehen will, und jegliche Abmahn-Schwachstellen im Bereich der Cookie-Informationspflicht ausschließen möchte macht es so: Informieren Sie den Nutzer über alle Cookies die auf Ihrer Seite verwendet werden inklusive den Zweck der Verwendung. Holen Sie zudem die Einwilligung der verwendeten Cookies ein. Der User muss in dieser Version der Verwendung der Cookies mit einem Klick zustimmen.

Wir empfehlen übrigens den Mittelweg, weil zu viele Buttons und Bestätigungen den User schnell mal nerven und wieder abschrecken könnten. Solange es es in dem Bereich auch noch keine Abmahnungen hagelt werden wir uns diesbezüglich mal nicht zu sehr verrückt machen lassen.

A propos Empfehlungen: Wir können Ihnen das Rechtstexte Abonnement von erecht24 wärmstens ans Herz legen. Sie erhalten rechtssichere Rechtstexte für Ihre Webseite wie zum Beispiel: Datenschutz, AGB, Impressum und zahlreiche zusätzliche Muster Formulare. Gerade für Online-Shops sind wasserdichte Rechtstexte unentbehrlich. Der Vorteil bei erecht24: Die Texte werden regelmäßig aktualisiert und können über ein Plugin bei WordPress (oder Shopware etc.) eingebunden werden. Das Plugin aktualisiert dann die Texte automatisch über die Schnittstelle für Sie – praktischer geht es nicht.

Kostenfaktor: ca. 10 – 15 €, je nach Bedarf. Zusätzlich können auch Rechtstexte für ebay & Amazon hinzugedacht werden. Klicken Sie auf diesen (Partner-) Link um ihre Webseite / Ihren Online Shop rechtlich abzusichern.

Soviel dazu.

Kommen wir also wieder zurück zu den WordPress Cookie Plugins:

Wir haben folgende 3 Plugins getestet:
1. WordPress Cookie Plugin – Ginger EU Cookie Law
2. WordPress Cookie Plugin – EU Cookie Law
3. WordPress Cookie Plugin – Cookie Notice von dFactory

1. WordPress Cookie Plugin – Ginger EU Cookie Law

WordPress Cookie Plugin – Ginger EU Cookie Law

An sich ein gutes Plugin, wenn man ein bisschen englisch kann und ca. 15 Minuten Geduld mitbringt um die Einstellungen vorzunehmen und ein paar Zeilen CSS zu schreiben. Man kann die Farbe, Hintergrundfarbe, Button & Linkfarbe anpassen, bestimmen ob der Balken oben oder unten angezeigt wird und vieles mehr.

Ginger EU Cookie Law ist also auf jeden Fall ein sehr gutes WordPress Cookie Plugin.

Übrigens verwenden wir, wenn das Plugin zum Einsatz kommt, folgenden Code um den Cookie-Balken etwas zu verkleinern. Den Code kann man gleich bei den Plugin Einstellungen einbinden, was sehr praktisch ist.

/* Cookie Balken - Abstände vom Text nach außen */
.ginger_container.bottom {
    padding: 0px;
}

/* Text-Absatz - Schriftgröße, Abstände etc. */
.ginger_container .ginger_message {
    margin-top: 1.2em;
    font-size: 0.8em;
    margin-left: 15px;
    font-size: 14px !important;
}

Bugs: Im Test zeigte es jedoch Schwächen bei den Farbeinstellungen – bei der Aktivierung auf great2gether.com wurden die Farbanpassungen für den Hintergrund z.B. nicht übernommen, daher wurde es wieder gelöscht.

Installationen: + 5.000
Grobe Einstufung: 9 / 10 Punkte
Link: https://de.wordpress.org/plugins/ginger/

2. WordPress Cookie Plugin – EU Cookie Law

WordPress Cookie Plugin – EU Cookie Law

Das WordPress Cookie Plugin EU Cookie Law ist schnell installiert und konfiguriert. Über 60.000 aktive Installationen sprechen für seine Beliebtheit. Für Einsteiger empfehlen wir eher dieses Plugin, als Ginger Cookie Law.

Etwas unschön: Im Gegensatz zu den meisten anderen WordPress Cookie Plugin wird die Info nicht in einem durchgehenden Balken sondern in einem Popup Fenster angezeigt. Das sieht nicht wirklich schön aus und passt nicht in das Design von modernen Webseiten. Wer es also lieber geradlinig mag nimmt eines der anderen WordPress Cookie Plugins.

Bugs: Liess sich im Test nur unten anzeigen.

Installation: + 60.000
Grobe Einstufung: 7 / 10 Punkte
Link: https://de.wordpress.org/plugins/eu-cookie-law/

3. WordPress Cookie Plugin – Cookie Notice von dFactory

WordPress Cookie Plugin – Cookie Notice von dFactory

Dieses WordPress Cookie Plugin war bisher unser Standard-Plugin und genauso wie EU Cookie Law auch besonders für Einsteiger geeinigt die keine Lust auf 5000 verschiedene Einstellungsmöglichkeiten haben.

Unschön: Die Buttons sind nicht so leicht anpassbar und sehen in der Standard-Ausführung etwas altmodisch aus. Daher mussten wir ein paar Zeilen CSS Code hinzufügen:

/* Cookie Notice Anpassung - Weniger Höhe */
.cookie-notice-container {
    padding: 2px !important;
}
/* Cookie Notice Anpassung - Button Hintergrund Farbe weiss und geringere Rundung */
#cookie-notice .button.wp-default {
      background: rgba(255,255,255,0.9);
      border-radius: 1px; /* vorher 3px */
      margin: 5px 7px;
      padding: 0px 12px;
}

Installation: + 200.000
Grobe Einstufung: 8 / 10 Punkte
Link: https://de.wordpress.org/plugins/cookie-notice/

Dieses Plugin war dann auch unser Favorit auf great2gether.com – die Meldung wird beim ersten Besuch der Seite angezeigt. Sobald der User aber 400px runterscrollt verschwindet die Anzeige wieder. So wird auf der Seite nichts verborgen, man ist seinen Pflichten (halbwegs) nachgekommen und der User wird nicht mehr unnötig verunsichert.

Übrigens haben wir den Link zu den Datenschutzbestimmungen auf einen Anker gesetzt – so dass der User beim klick auf das verlinkte Wort gleich an der richtigen Stelle bei den Datenschutzbestimmungen landet.

Das sieht dann so aus:

Mit der Nutzung unserer Seite stimmen Sie der Verwendung von <a href="http://great2gether.com/datenschutzbestimmungen#cookies" style="color:#fff;font-weight:bold">Cookies</a> zu.

Der Anker sieht so aus, und muss über der Überschrift des Cookies Absatzes eingebaut werden.

<a name="cookies"> </a>

Ich hoffe der Beitrag über die WordPress Cookie Plugins hat euch gut gefallen und vor allem weitergeholfen. Wenn ihr noch andere gute Plugins kennt, lasst es uns in den Kommentaren wissen.

The post 3 kostenlose WordPress Cookie Plugins appeared first on great2gether - Werbeagentur aus Köln.

Manchmal kommt es vor, dass man die Inhalte vom WordPress Plugin All in One SEO in ein (meiner Meinung nach) besseres Plugin namens Yoast SEO importieren möchte. Als ich das zum ersten Mal gemacht habe musste ich erst eine Weile recherchieren und testen bis ich den einen und auch anderen Weg zum Ziel gefunden habe.

Übersicht:
1. Backup machen
2. Yoast SEO installieren
3. Alternative: SEO Data Transporter Plugin
4. Die eigene Import und Export Funktion von Yoast SE

1. Inhalte von All in One SEO bei Yoast SEO importieren – Backup machen

Ja ein Backup sollte man immer machen, am besten sekündlich.

2. Inhalte von All in One SEO bei Yoast SEO importieren – Yoast SEO installieren

Ich gehe jetzt davon aus, dass WordPress installiert ist (am besten auf einer Testumgebung) und dass auf der WordPress Installation zahlreiche Beiträge sind, deren Meta Descriptions etc. über das Plugin „All in one SEO“ eingegeben wurden. Ist das der fall kann also der 1. Schritt ausgeführt werden, der da lautet: Yoast SEO Plugin installieren. Wie das geht weiß jeder.

Wenn nun beide SEO Plugins aktiviert sind bekommt man folgende Anzeige im Admin Bereich:

Yoast SEO Import – Dashboard

Wie man sieht haben sich beide Plugins gegenseitig entdeckt und reißen sich nun um den User. Mit einem Klick auf den zweiten Link wo steht „Das Plugin All-In-One-SEO wurde entdeckt. Möchtest du die Einstellungen importieren?“ bewegen wir uns einen Schritt weiter in Richtung Yoast SEO Import.

NICHT…

Denn bei mir kam dieser grau-weiß-schwarze Fehler der mich nach einem anderen Weg suchen lassen hat.

Yoast SEO Import – Fehler

Cooler Fehler oder? Mal sehen vielleicht bekommen wir noch ein paar angezeigt.

3. Inhalte von All in One SEO bei Yoast SEO importieren – Alternative: SEO Data Transporter Plugin

Ich habe ein geheimes Plugin gefunden mit dem ich alle Inhalte optimal in Yoast SEO importieren konnte. Es nennt sich: SEO Data Transporter. Installieren und aktivieren geht fast so schnell wie diesen Satz hier zu schreiben, wenn man sich nicht vertippt. Ist es aktiviert sollte das All in One SEO Plugin deaktiviert werden.

Also noch einmal zur Sicherheit:
Yoast SEO Plugin – aktivieren
SEO Data Transporter – aktivieren
All in One SEO – deaktivieren

Ist das getan gehe ich in den Bereich: Werkzeuge > SEO Data Transport und wähle links All in One SEO Pack…

Yoast SEO Import – SEO Data Transpaorter Import

…und rechts WordPress SEO (Das ist der andere Name für Yoast SEO um die Leute etwas zu verwirren) aus. Als nächstes muss man auf Analyze klicken. Alles in allem ein recht simple Geschichte.

Yoast SEO Import – SEO Data Transporter Export

Hat man den Analyze Button getroffen passiert folgendes:

Yoast SEO Import – SEO Data Transporter Analyse

Genau – man bekommt angezeigt, was es zu importieren gibt. Sollte da keine Null stehen macht es Sinn im nächsten Schritt auf den blauen Convert Button zu klicken. Viel Erfolg!

So sieht es aus wenn alles wunderbar geklappt hat:

Yoast SEO Import – SEO Data Transporter Conversion

4. Die integrierte Import und Export Funktion von Yoast SEO
Installieren Sie Yoast SEO und deaktivieren Sie das All in One SEO Pack. Klicken Sie als nächstes in der Admin-Sidebar Ihrer WordPress-Seite auf: SEO > Werkzeuge um danach hier zu landen:

Yoast SEO Import von All in One SEO – Yoast Werkzeuge

Sie haben Yoast SEO auf jeden Fall installiert, aber der Werkzeuge Link läßt sich icht blicken? Dann gehen noch schnell in den Bereich: Yoast > Dashboard > Features und aktivieren Sie dort den ersten Button, wo Advanced Setting pages steht.

Dann sollte man natürlich auf den Import und Export Link klicken. Auf der nächsten Seite klicken Sie dann auf den Tab Importieren von anderen Plugins. Setzen Sie als nächstes das Häkchen bei der Checkbox Import aus dem All-in-One SEO?

Yoast SEO Import von All in One SEO – Yoast Werkzeuge – Von anderen plugins

enn alles geklappt habt bekommt man ganz oben eine dezente Erfolgsnachricht angezeigt. Ob alles funktioniert sieht man in den Seiten- und Beitragsübersichten. Wenn die Zeile SEO Titel und Meta Beschr. dort nicht angezeigt werden bedarf es noch der Aktivierung im Bereich Ansicht anpassen.

Yoast SEO Import von All in One SEO – Beitragsübersicht

Also dann viel Erfolg beim Yoast SEO Import bzw. beim All In One SEO Export.

Optimale Einstellung des Yoast SEO Plugins.
https://www.saskialund.de/yoast-seo-plugin-optimal-einstellen-so-gehts/

The post Yoast SEO Import von All in One SEO appeared first on great2gether - Werbeagentur aus Köln.