Nabend nochmal, Habe mein Logo als .AI Datei für Illustrator hier. Habe bisher das Logo direkt exportiert als PNG, nur das Logo, keinerlei Ränder, dachte das sei das beste hinsichtlich der Kompatibilität. Nun ist das Logo auf 72dpi ca 451x93px groß. Das ist noch ein wenig zu groß, und das Logo ist deswegen nichtmehr völlig scharf, das größere Problem aber ist sobald ich scrolle, und die Leiste "sticky" wird, verpixelt das Logo erst leicht und wird dann schwammig. Gibt es eine Möglichkeit ein zweites Logo nur fürs Sticky hochzuladen? Oder muss ich was an den Einstellungen ändern. Im Moment steht zB Logo auf 180px Breite, andere Werte ändern auch nicht viel. Wie geh ich da am besten vor?
Hi, wenn du dein Logo bereits als Vektor-Grafik in AI hast, kannst du es auch als SVG Datei exportieren. SVG kann von jedem modernen Browser gelesen werden, wenn der Browser die Grafik dann skaliert, gibt es auch keine unschöne Verpixelung.
Das klingt natürlich sehr gut! Werde ich gleich mal probieren. Wäre das eleganteste. EDIT: Leider ist der LogoManager nicht der Meinung, .svg anzunehmen.
Stimmt, mit dem Logomanager geht das aktuell nicht. Vergleich aber einmal den Demoshop3, der verwende ein SVG Logo. Dort ist das einfach direkt in den Quellcoder der Indexseite geschrieben, als Usermod. Das sieht da so aus: Code: <div id="navbar-brand" class="navbar-brand"> <a href="https://www.gambio-shop.de/shop3/index.php" title="Testshop"> <svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 583.8 145" style="enable-background:new 0 0 583.8 145;" xml:space="preserve"> <g> <polygon points="254.9,106.3 254.9,51.3 274.8,51.3 274.8,42.3 224.1,42.3 224.1,51.3 243.8,51.3 243.8,106.3 "/> <path d="M322,96c-1.9,1.6-4.9,2.4-8.7,2.4c-4.5,0-7.9-1-10.3-3c-2.4-2-3.6-4.8-3.6-8.4h-11.1c0,4,1.1,7.5,3.2,10.5 c2.2,3,5.2,5.4,9.1,7.1c3.9,1.7,8.1,2.6,12.8,2.6c7,0,12.5-1.6,16.6-4.7c4.1-3.1,6.1-7.4,6.1-12.7c0-3.3-0.7-6.1-2.1-8.6 c-1.4-2.4-3.6-4.6-6.6-6.5c-3-1.9-7-3.6-12-5c-5-1.5-8.6-3-10.7-4.6c-2.2-1.6-3.3-3.5-3.3-5.8c0-2.8,1-4.9,3-6.5 c2-1.5,4.8-2.3,8.5-2.3c3.9,0,6.9,0.9,9,2.8c2.1,1.9,3.1,4.5,3.1,7.8H336c0-3.7-1-7.1-3-10.1c-2-3-4.7-5.4-8.2-7 c-3.5-1.6-7.5-2.5-11.9-2.5c-6.7,0-12.2,1.7-16.4,5c-4.2,3.3-6.3,7.6-6.3,12.7c0,5.9,2.9,10.7,8.7,14.3c3,1.9,7.1,3.6,12.3,5.2 c5.2,1.6,8.7,3.1,10.7,4.6c2,1.5,3,3.7,3,6.5C324.9,92.4,324,94.4,322,96z"/> <polygon points="146.9,51.3 146.9,42.3 105.4,42.3 105.4,106.3 147.2,106.3 147.2,97.3 116.5,97.3 116.5,77.7 142.8,77.7 142.8,68.9 116.5,68.9 116.5,51.3 "/> <polygon points="68,106.3 68,51.3 88,51.3 88,42.3 37.2,42.3 37.2,51.3 57,51.3 57,106.3 "/> <path d="M195.8,96c-1.9,1.6-4.9,2.4-8.7,2.4c-4.5,0-7.9-1-10.3-3c-2.4-2-3.6-4.8-3.6-8.4H162c0,4,1.1,7.5,3.2,10.5 c2.2,3,5.2,5.4,9.1,7.1c3.9,1.7,8.1,2.6,12.8,2.6c7,0,12.5-1.6,16.6-4.7c4.1-3.1,6.1-7.4,6.1-12.7c0-3.3-0.7-6.1-2.1-8.6 c-1.4-2.4-3.6-4.6-6.6-6.5c-3-1.9-7-3.6-12-5c-5-1.5-8.6-3-10.7-4.6c-2.2-1.6-3.3-3.5-3.3-5.8c0-2.8,1-4.9,3-6.5 c2-1.5,4.8-2.3,8.5-2.3c3.9,0,6.9,0.9,9,2.8c2.1,1.9,3.1,4.5,3.1,7.8h11.1c0-3.7-1-7.1-3-10.1c-2-3-4.7-5.4-8.2-7 c-3.5-1.6-7.5-2.5-11.9-2.5c-6.7,0-12.2,1.7-16.4,5c-4.2,3.3-6.3,7.6-6.3,12.7c0,5.9,2.9,10.7,8.7,14.3c3,1.9,7.1,3.6,12.3,5.2 c5.2,1.6,8.7,3.1,10.7,4.6c2,1.5,3,3.7,3,6.5C198.7,92.4,197.7,94.4,195.8,96z"/> <polygon points="354.8,42.3 354.8,106.3 365.9,106.3 365.9,77.9 394.5,77.9 394.5,106.3 405.6,106.3 405.6,42.3 394.5,42.3 394.5,68.9 365.9,68.9 365.9,42.3 "/> <path d="M540.4,47.9c-4.2-3.7-9.9-5.6-17-5.6h-24.5v64H510V82.5h13.2c7.4,0,13.2-1.7,17.3-5.2c4.1-3.5,6.2-8.4,6.2-14.7 C546.7,56.5,544.6,51.6,540.4,47.9z M532.4,70.8c-2.1,1.9-5.1,2.8-9.1,2.8H510V51.3h13.7c3.7,0.1,6.6,1.1,8.7,3.2s3.2,4.8,3.2,8.3 C535.6,66.2,534.5,68.9,532.4,70.8z"/> <path d="M438.5,103.4c4.1,2.5,8.7,3.8,13.9,3.8c5.2,0,9.9-1.3,13.9-3.8c4-2.5,7.1-6.2,9.3-10.9c2.2-4.7,3.3-10.2,3.3-16.5v-3.6 c0-6.2-1.1-11.7-3.3-16.4s-5.3-8.3-9.3-10.8c-4-2.5-8.7-3.8-13.9-3.8s-9.8,1.3-13.9,3.8c-4,2.5-7.1,6.2-9.4,11 c-2.2,4.8-3.3,10.3-3.3,16.5v3.6c0,6.1,1.1,11.5,3.4,16.2C431.3,97.2,434.4,100.8,438.5,103.4z M436.9,72.3 c0.1-6.9,1.4-12.2,4.2-16c2.7-3.8,6.5-5.6,11.3-5.6c4.9,0,8.7,1.9,11.4,5.7c2.7,3.8,4,9.2,4,16.3V76c0,7.2-1.3,12.7-4,16.4 c-2.7,3.8-6.4,5.6-11.4,5.6c-4.9,0-8.7-1.9-11.4-5.8c-2.7-3.8-4.1-9.3-4.1-16.3V72.3z"/> </g> <g> <rect x="5.1" y="5.4" class="st0" width="573.5" height="134.1"/> </g> </svg> </a> </div>
Leider weiß ich noch nicht genau, wie ich das umsetzen soll. Hab mir die index.php angesehen und finde nichts. Oder soll ich das über den Content Manager machen? Und was ist mit den polygon points, die sind doch wahrscheinlich auf das Logo von dem anderem Shop zugeschnitten, nicht auf meinen.
Du musst die Datei /templates/Honeygrid/snippets/header/logo-USERMOD.html aus dem Testshop3 mal anschauen und die Polygonpunkte durch deine ersetzen.
Ok,danke. Muss nur erstmal die Polygon Punkte aus der Datei bekommen. Auf den ersten Blick gesehen hab ich die momentan nämlich nicht
Hallo, du bekommst die Polygone aus der Datei, indem du dein Illustrator .AI Logo als .SVG speicherst. Musst natürlich in Illu als Vektordatei haben . Dannach ziehst dir die gespeicherte Datei in einen Texteditor. Dann hast deine Polygone. So viel zur Theorie! Ich bekomm in der Praxis damit aber nen bösen smartyEngine Fehler :-? FATAL ERROR(1): "Uncaught --> Smarty Compiler: Syntax error in template "get_usermod:templates/Honeygrid/snippets/header/logo.html" on line 14 ".st0{fill-rule:evenodd;clip-rule:evenodd;fill:#111110;}" - Unexpected ":", expected one of: "}" <-- thrown <div id="navbar-brand" class="navbar-brand"> <a href="http://www.fischer-lahr.de/" title=" Kellerei-Technik Fischer"> <!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 250 85" style="enable-background:new 0 0 250 85;" xml:space="preserve"> <style type="text/css"> .st0{fill-rule:evenodd;clip-rule:evenodd;fill:#111110;} .st1{fill:#111110;} </style> <g> <path class="st0" d="M104.2,65.9V64h1.4l-1.1-3.2c-0.1-0.1-0.1-0.2-0.1-0.5c-0.1-0.2-0.1-0.4-0.2-0.8V58h1.8l3.7,9.7h-2.8l-0.6-1.7 H104.2L104.2,65.9z M104.6,55.7c0-0.2,0.1-0.4,0.3-0.6c0.2-0.2,0.4-0.3,0.7-0.3c0.2,0,0.5,0.1,0.7,0.2c0.2,0.2,0.2,0.4,0.2,0.7 c0,0.3-0.1,0.5-0.2,0.7c-0.2,0.2-0.5,0.3-0.7,0.3c-0.3,0-0.6-0.1-0.7-0.3C104.7,56.2,104.6,56,104.6,55.7L104.6,55.7z M112.2,67.7 v-7.4h-2.4V58h7.6v2.3h-2.4v7.4H112.2L112.2,67.7z M118.9,67.7V58h6.5v2.1h-3.7v1.7h3.5v2h-3.5v1.7h3.7v2.2H118.9L118.9,67.7z M104.2,58h-1.8l-3.6,9.5v0.1l0.1,0.1h-0.1h2.8l0.6-1.7h2V64h-1.4l1.1-3.2c0.1-0.2,0.1-0.4,0.2-0.6c0.1-0.2,0.1-0.4,0.2-0.7l0,0V58 L104.2,58z M101.7,55.7c0-0.2,0.1-0.4,0.3-0.6c0.2-0.2,0.5-0.3,0.7-0.3c0.3,0,0.6,0.1,0.7,0.2c0.2,0.2,0.3,0.4,0.3,0.7 c0,0.3-0.1,0.5-0.3,0.7c-0.2,0.2-0.4,0.3-0.7,0.3c-0.2,0-0.5-0.1-0.7-0.3C101.8,56.2,101.7,56,101.7,55.7L101.7,55.7z M98.8,67.5 l-0.1,0.2h0.1h-3.2l-1.2-2v-3.2c0.3-0.1,0.6-0.1,0.7-0.2c0.2-0.2,0.4-0.5,0.4-0.9c0-0.5-0.1-0.8-0.4-1.1c-0.2-0.1-0.4-0.2-0.7-0.2 v-2c0.7,0,1.2,0.1,1.6,0.1c0.5,0.1,0.9,0.2,1.2,0.5c0.4,0.2,0.7,0.6,0.9,1c0.2,0.4,0.3,0.9,0.3,1.4c0,0.7-0.2,1.4-0.6,1.9 c-0.4,0.4-1,0.7-1.8,0.9L98.8,67.5L98.8,67.5L98.8,67.5z M94.4,58c-0.2,0-0.6,0-0.9,0h-3v9.7h2.7v-3.8l1.2,1.8v-3.2 c-0.2,0-0.4,0-0.6,0h-0.6V60h0.6c0.2,0,0.4,0.1,0.6,0.1V58L94.4,58z M64,65.7v-3.2c0.3-0.1,0.6-0.1,0.7-0.2 c0.3-0.2,0.4-0.5,0.4-0.9c0-0.5-0.1-0.8-0.4-1.1c-0.2-0.1-0.4-0.2-0.8-0.2v-2c0.7,0,1.3,0.1,1.6,0.1c0.5,0.1,0.9,0.2,1.2,0.5 c0.4,0.2,0.7,0.6,0.9,1c0.2,0.4,0.3,0.9,0.3,1.4c0,0.7-0.2,1.4-0.6,1.9c-0.4,0.4-1,0.7-1.7,0.9l2.8,3.9h-3.2L64,65.7L64,65.7z M74.6,64.1v-2h5.7c0,0.1,0,0.1,0,0.2c0,0.1,0,0.2,0,0.4c0,1.7-0.5,2.9-1.4,3.8c-1,0.9-2.3,1.4-4.1,1.4c-0.9,0-1.6-0.1-2.3-0.4 c-0.6-0.2-1.2-0.6-1.8-1.1c-0.5-0.4-0.9-1-1.1-1.6c-0.3-0.6-0.4-1.3-0.4-2c0-0.7,0.1-1.4,0.4-2c0.3-0.6,0.7-1.2,1.2-1.7 c0.5-0.4,1.1-0.8,1.8-1.1c0.7-0.2,1.4-0.4,2.2-0.4c1.1,0,2,0.2,2.8,0.6c0.8,0.4,1.5,0.9,2,1.7l-2.5,1.1c-0.3-0.4-0.6-0.7-1-0.9 ----------------- </g> </svg> </a> </div>
Habe das gleiche Problem Kann einer mal eine verständliche Anleitung schreiben, welche Punkte man in Illustrator anwählen muss zum Export bei mir sieht das ganz anders aus ... und beim restlichen Ablauf der Integration verstehe ich auch nur Bahnhof Bei mir sieht das so aus: <?xml version="1.0" encoding="utf-8"?> <!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="415px" height="145px" viewBox="0 0 415 145" enable-background="new 0 0 415 145" xml:space="preserve"> <text transform="matrix(1.0272 0 0 1 48.5557 87.7051)" font-family="'FreebooterScript'" font-size="89.0065">Bougie 67</text> <text transform="matrix(0.4284 0 0 1 203.6299 126.9668)" fill="#C78A97" font-family="'Swiss721BT-Italic'" font-size="31.5362">pour une ambiance chaleureuse</text> </svg>
Sieht bei dir ja soweit OK aus. Zieh die SVG-Datei ins Browserfenster und gugg ob er's schluckt. Aber du scheinst schriften eingebundne zu haben. Wandle Sie in Vektoren um. Weiss nit, ob eine exotische Schrift, die du auf dem Rechner hast geht. Illu Menü > Objekt > umwandeln Ich werde es als ganz normales Bild einbinden. Dann sollt's auch mit Smarty klappen. Der Vorteil ist ausserdem: Ich hab bei dem folgenden Logo etwa 20KB reinen Text, um die Vektoren bzw. Polygone zu definieren!!! Den mag ich nicht jedesmal im Quelltext JEDER Seite mitschicken! <img alt="Lagerverkauf:Kellereitechnik aus Baden" title="Lagerverkauf:Kellereitechnik aus Baden " src="https://gartendeko.fischer-lahr.de/images/fischer-kellereitechnik.svg"> Alternativ gibt es die Empfehlung es als Objekt einzubinden... für Explorer 8 <object data="https://gartendeko.fischer-lahr.de/images/fischer-kellereitechnik.svg" type="image/svg+xml"> <!---Fallback---> Ihr Browser kann leider kein svg darstellen! </object> Grüßle Martin
also, ich hab das hier mal schnell und schmutzig gemacht https://gartendeko.fischer-lahr.de/Gartenfeuerstellen/ Logo in Illu als SVG gespeichert. Vorher alle Schriften in Pfade umgewandelt Illu Menü > Objekt > umwandeln so schaut die aus view-source:https://gartendeko.fischer-lahr.de/images/hotlink-ok/YERD-Logo-schwarz.svg .svg Datei in ein Verzeichnis auf Server laden. Die Template Datei abändern (Endung USERMOD) templates/Honeygrid/snippets/header/logo-USERMOD.html {if $logo_url} <div id="navbar-brand" class="navbar-brand"> <a href="{$logo_link}" title="{$smarty.const.STORE_NAME|escape:'html'}" > <img alt=" Logo Yerd {$smarty.const.STORE_NAME|escape:'html'}" src="https://gartendeko.fischer-lahr.de/images/hotlink-ok/YERD-Logo-schwarz.svg" id="LogoSVG"> </a> </div> {/if} Hab nur noch ein kleines CSS-Problem beim scrollen... logo wird nicht kleiner..... Muss wohl die Höhe in % definieren.... Gruß martin wehrle
.svg Datei in ein Verzeichnis auf Server laden. Die Template Datei abändern (Endung USERMOD) templates/Honeygrid/snippets/header/logo-USERMOD.html {if $logo_url} <div id="navbar-brand" class="navbar-brand"> <a href="{$logo_link}" title="{$smarty.const.STORE_NAME|escape:'html'}" > <img alt=" Logo Yerd {$smarty.const.STORE_NAME|escape:'html'}" src="https://gartendeko.fischer-lahr.de/images/hotlink-ok/YERD-Logo-schwarz.svg" id="LogoSVG"> </a> </div> {/if} Hab nur noch ein kleines CSS-Problem beim scrollen... logo wird nicht kleiner..... Muss wohl die Höhe in % definieren.... Ich probiere das mal so im testshop .... wenn nicht komme ich nach "Lahr" ist eine Katzensprung (30min) von mir aus, dann darfst mir in css. Nachhilfe geben.
Ab 3.8.0.4 geht das nun wieder leicht. Habe die SVG in /images/logos/ hochgeladen und als logo-USERMOD.html eingefügt. Im Admin muss aber unter Logo Manager dennoch eine Bilddatei hochgeladen sein, sonst wird nix angezeigt. HTML: {if $logo_url} {block name="snippets_header_logo"} <div id="navbar-brand" class="navbar-brand"> <a href="{$logo_link}" title="{$smarty.const.STORE_NAME|escape:'html'}"> <img class="img-responsive" src="/images/logos/LOGO.svg" alt="{$smarty.const.STORE_NAME|escape:'html'}-Logo"> </a> </div> {/block} {/if}
Hallo, ich versuche gerade unser Logo im Testshop als SVG-Datei einzubinden. Ich habe es genauso gemacht, wie pema es im letzten Post beschrieben hat - OHNE ERFOLG Im Quelltext wird das Logo als ".png" anstatt als ".svg" angezeigt. Kennt ihr den Fehler?
Ist der Dateiname exakt im Code genauso wie auf dem FTP (z.B. Groß-/Kleinschreibung)? Beim Logo Manager das Logo in jpg/png hochgeladen? Alles Caches (Shop, Browser und über FTP die Inhalte von /templates_c mit Ausnahme von .htaccess) geleert? Edit: Blöde Frage, aber für den Testshop hast du das Logo schon im Verzeichnis TESTSHOP/images/logos hochgeladen, oder? Passiert mir manchmal, dass ich Bilder im echten Shop und nicht im Testshop einfüge und sie dann natürlich nicht angezeigt werden.
1) Der Dateiname ist im Verzeichnis und in der logo.html identisch. Ich habe die logo.html überschrieben, anstelle einer USERMOD. Sollte aber den gleichen Effekt erzielen oder? 2) Im Logo Manager habe ich eine .png hochgeladen 3) templates_c ist geleert 4) Ja, liegt im richtigen Verzeichnis des Testshops Trotz allem wird das Logo immer noch nicht angezeigt. Interessanterweise wird es bei der Aktualisierung des Fensters für einen Bruchteil kurz geladen und verschwindet dann wieder... Wie gesagt erscheint es im Quelltext als .png, obwohl es eine .svg ist!
Erscheint jetzt aktuell im Quellcode der Container <div id="navbar-brand" class="navbar-brand"> bei dir? Ja: dann stimmt was mit dem Code in logo-USERMOD.html nicht. Hast du weiteren Code in der Datei für Anpassungen hinterlegt? Nein: Logo Manager -> Datei verwenden einschalten und entsprechend die PNG hochladen. Lösche mal die /templates/Honeygrid/snippets/header/logo-USERMOD.html (bzw. den Block mit dem SVG) und leere alle Caches. Erscheint das normale .png Logo dann im Shop, welches unter Logo Manger eingefügt und verwendet wird? Ich habe es bei mir gerade nachgestellt, logo-USERMOD.html gelöscht und alle Caches geleert. Dann erscheint die PNG Variante. logo-USERMOD.html wieder hochgeladen, Caches geleert -> SVG wird angezeigt.