Sehr geehrte Kunden,
viele von Ihnen nutzen bereits die praktische Blog-Funktion des POWERGAP Systems.
Wir haben diese nun auch für das mobile Frontend fit gemacht, so dass die Beiträge auch dort angezeigt werden können.
Voraussetzung ist allerdings, dass das HTML was Sie bei den Beiträgen schreiben auch auf mobile Geräte angepasst ist. Sprich feste WIDTH Angaben oder Tabellen-Konstrukte dürfen da nicht benutzt werden, damit so ein Beitrag auch auf dem mobilen Gerät vernünftig angezeigt wird. Wer einfach nur reine Texte erfasst, der muss sich keine Gedanken machen.
Hier der Pilotkunde, bei dem wir das als erstes umgesetzt haben: www.silber-philharmoniker.de (Bitte auf dem Smartphone aufrufen. Ist dort auch von der Startseite aus verlinkt.)
Dieser Standard CSS-Code muss zunächst über Layout > Schriften/CSS > Mobile eingesetzt werden:
Evtl. sind natürlich Anpassungen an das eigene CI notwendig.
Über das weiße N-Symbol in der Icon-Leiste > Blog-Einstellungen gehört folgender Code in die 2 großen Textfelder:
Blog-HTML:
Blog-Archiv-HTML:
Das "#20#" im unteren Code muss entsprechend angepasst werden an die ID des HTML-Includes worüber man den Blog Über Sonstiges > HTML-Includes gepflegt hat. Das ist in jedem Shop sichert unterschiedlich. Hier im Beispiel eben die ID 20.
Am Ende muss man noch über Layout > Mobile z.B. im Footer oder im Startseiten-Template eine Verlinkung zum Blog einstellen. Die URL ist:
Auch hier wieder muss die 20 eben durch die bei Ihnen in den HTML-Includes genutzte ID für den Blog ausgetauscht werden.
Wie immer, bieten wir gegen Aufwand die komplette Einstellung dieses Updates an. Mit allen Anpassungen ca. 60 Minuten Aufwand.
viele von Ihnen nutzen bereits die praktische Blog-Funktion des POWERGAP Systems.
Wir haben diese nun auch für das mobile Frontend fit gemacht, so dass die Beiträge auch dort angezeigt werden können.
Voraussetzung ist allerdings, dass das HTML was Sie bei den Beiträgen schreiben auch auf mobile Geräte angepasst ist. Sprich feste WIDTH Angaben oder Tabellen-Konstrukte dürfen da nicht benutzt werden, damit so ein Beitrag auch auf dem mobilen Gerät vernünftig angezeigt wird. Wer einfach nur reine Texte erfasst, der muss sich keine Gedanken machen.
Hier der Pilotkunde, bei dem wir das als erstes umgesetzt haben: www.silber-philharmoniker.de (Bitte auf dem Smartphone aufrufen. Ist dort auch von der Startseite aus verlinkt.)
Die Einrichtung
Voraussetzung sind zunächst mal die älteren Updates rund um das Thema Blog. Also beispielsweise Der-POWERGAP-interne-Blog-auf-voller-Shopbreite usw., diese müssen alle auf dem neusten Stand sein.Dieser Standard CSS-Code muss zunächst über Layout > Schriften/CSS > Mobile eingesetzt werden:
.htm_100 {width:100%;}
.blog {float:left;}
.blog_archiv_news_txt {font-size: 10px;}
ul.blog_archiv_news_ul a {text-decoration:none!important;}
li.blog_archiv_news_li {margin-bottom:5px;}
.blog_archiv_news_dat {font-weight:bold;}
li.blog_archiv_news_li a {margin-bottom:15px;font-weight:normal;}
.blog_archiv_news_dat:after {content: ":";}
.blog_archiv_anzahl {color:#444;font-size: 11px;font-weight:bold!important;}
.blog_text {margin:10px 0;text-align:justify;}
#html-blog {width: 100%;float: left;margin-right: 15px;}
#html-blog h1 {color:#444;font-size: 20px;margin: 15px 0 15px 0;}
#html-blog h2 {color:#444;font-size: 18px;margin: 12px 0 12px 0;}
#html-blog h3 {color:#444;font-size: 14px;margin: 10px 0 10px 0;}
.blog_archiv h2 {color:#444;font-size: 18px;}
#html-blog .blog_archiv {width:200px;float:left;display:block;}
#html-blog .ui-widget-content {border:0;}
.html_include{min-height: 900px;}
.blog {float:left;}
.blog_archiv_news_txt {font-size: 10px;}
ul.blog_archiv_news_ul a {text-decoration:none!important;}
li.blog_archiv_news_li {margin-bottom:5px;}
.blog_archiv_news_dat {font-weight:bold;}
li.blog_archiv_news_li a {margin-bottom:15px;font-weight:normal;}
.blog_archiv_news_dat:after {content: ":";}
.blog_archiv_anzahl {color:#444;font-size: 11px;font-weight:bold!important;}
.blog_text {margin:10px 0;text-align:justify;}
#html-blog {width: 100%;float: left;margin-right: 15px;}
#html-blog h1 {color:#444;font-size: 20px;margin: 15px 0 15px 0;}
#html-blog h2 {color:#444;font-size: 18px;margin: 12px 0 12px 0;}
#html-blog h3 {color:#444;font-size: 14px;margin: 10px 0 10px 0;}
.blog_archiv h2 {color:#444;font-size: 18px;}
#html-blog .blog_archiv {width:200px;float:left;display:block;}
#html-blog .ui-widget-content {border:0;}
.html_include{min-height: 900px;}
Evtl. sind natürlich Anpassungen an das eigene CI notwendig.
Über das weiße N-Symbol in der Icon-Leiste > Blog-Einstellungen gehört folgender Code in die 2 großen Textfelder:
Blog-HTML:
<div style="margin-left:20px;">
<div id="html-blog">
<h1>#blog_dat : #blog_title</h1>
<h2>#blog_title</h2>
<p>#blog_text</p>
</div>
<div>
Archiv:#blog_archiv
<div><a href="Blog.html">» zurück zur Übersicht</a></div>
</div>
</div>
<div id="html-blog">
<h1>#blog_dat : #blog_title</h1>
<h2>#blog_title</h2>
<p>#blog_text</p>
</div>
<div>
Archiv:#blog_archiv
<div><a href="Blog.html">» zurück zur Übersicht</a></div>
</div>
</div>
Blog-Archiv-HTML:
#blog_htlm_include#20#
<div style="margin-left:20px;">
<div id="html-blog">
<br>
<h1 style="">Blog-Archiv für #blog_m/#blog_y</h1>
<h2 style="font-size:12px;">Hier finden Sie alle Test-Blog-Einträge aus dem Monat #blog_m/#blog_y</h2>
#blog_archiv_news
</div>
<div>
Archiv:#blog_archiv
<div><a href="Blog.html">» zurück zur Übersicht</a></div>
</div>
</div>
<div style="margin-left:20px;">
<div id="html-blog">
<br>
<h1 style="">Blog-Archiv für #blog_m/#blog_y</h1>
<h2 style="font-size:12px;">Hier finden Sie alle Test-Blog-Einträge aus dem Monat #blog_m/#blog_y</h2>
#blog_archiv_news
</div>
<div>
Archiv:#blog_archiv
<div><a href="Blog.html">» zurück zur Übersicht</a></div>
</div>
</div>
Das "#20#" im unteren Code muss entsprechend angepasst werden an die ID des HTML-Includes worüber man den Blog Über Sonstiges > HTML-Includes gepflegt hat. Das ist in jedem Shop sichert unterschiedlich. Hier im Beispiel eben die ID 20.
Am Ende muss man noch über Layout > Mobile z.B. im Footer oder im Startseiten-Template eine Verlinkung zum Blog einstellen. Die URL ist:
http://www.meine-shop-domain.de/m/?htmnr=20
Auch hier wieder muss die 20 eben durch die bei Ihnen in den HTML-Includes genutzte ID für den Blog ausgetauscht werden.
Wie immer, bieten wir gegen Aufwand die komplette Einstellung dieses Updates an. Mit allen Anpassungen ca. 60 Minuten Aufwand.