[3.3] Eigenes Logo funktioniert nicht (erledigt)

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.1/3.2, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
Benutzeravatar
Dr.Death
Moderator
Moderator
Beiträge: 16216
Registriert: 23.04.2003 08:22
Wohnort: Xanten
Kontaktdaten:

Re: [3.3] Eigenes Logo funktioniert nicht

Beitrag von Dr.Death »

Die "Arbeitsfläche" des SVG ist immer noch zu groß.....

Du solltest es auch als "responsive" abspeichern, dann kann die Größe variieren.


Hier mal der Inhalt eines angepassten SVN Logos für dich:

Den Code per Cut&paste in eine Textdatei kopieren und als site_logo.svg abspeichern.

Code: Alles auswählen

<?xml version="1.0" encoding="UTF-8" standalone="no"?> <!-- Created with Vectornator for iOS (http://vectornator.io/) --><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg height="100%" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="100%" version="1.1" viewBox="0 0 153 114">
<defs/>
<g id="Ebene_1_1_">
<path d="M98.9117+55.8708L94.0723+55.8708L101.924+40.2243L132.554+40.2243L144.089+55.8708L128.774+68.7413L137.98+86.4067L120.393+86.4067L113.522+75.1135L111.744+86.4067L93.8972+86.4067L98.9117+55.8708ZM116.15+53.4734L114.483+61.5066L124.224+53.7676L116.15+53.4734Z" opacity="1" fill="#ffffff"/>
<path d="M17.1972+40.2243L36.8701+40.2243L35.0064+50.2002L42.7923+40.2243L80.5803+40.2243L75.8303+71.265L96.2844+71.265L92.2152+86.4067L36.4003+86.4067L30.1524+75.145L28.1018+86.4067L11.0561+86.5014L16.1931+55.8708L10.9279+55.8708L17.1972+40.2243ZM55.4753+83.2996L60.703+55.3661L56.7354+55.3661L59.7498+48.0082L46.1086+64.4512L55.4753+83.2996Z" opacity="1" fill="#ffffff"/>
<path d="M19.0768+42.7479L15.328+52.5901L19.643+52.5901L14.4563+83.6308L25.5385+83.6308L28.7851+66.5962L38.5255+83.6308L52.9013+83.6308L43.0807+63.7256L60.3027+42.7479L44.3943+42.7479L30.5002+60.2667L33.4164+42.7479L19.0768+42.7479Z" opacity="1" fill="#003e61"/>
<path d="M89.8975+83.7569L92.6104+73.7886L72.4461+73.7886L77.327+42.7479L64.7937+42.7479L60.7433+52.5192L64.0032+52.5058L58.1772+83.6308" opacity="1" fill="#003e61"/>
<path d="M122.494+83.8831L113.287+68.489L111.664+68.489L109.122+83.8831L97.2458+83.8831L102.394+52.5901L98.8051+52.5901L103.782+42.7479L131.006+42.7479L140.324+54.956L125.057+67.6809L133.756+83.8831C133.756+83.8831+122.494+83.8831+122.494+83.8831ZM114.996+60.8338L123.455+53.8519L116.278+53.8519L114.996+60.8338Z" opacity="1" fill="#003e61"/>
<path d="M112.817+64.4512L115.167+52.5901L127.257+52.5901L112.817+64.4512ZM117.041+57.6373L119.321+55.8708L117.303+55.8708" opacity="1" fill="#ffffff"/>
</g>
</svg>

wernerz
Mitglied
Beiträge: 95
Registriert: 22.10.2014 09:16
Kontaktdaten:

Re: [3.3] Eigenes Logo funktioniert nicht

Beitrag von wernerz »

Hallo Jungs,

toll, beide Dateien funktionieren jetzt.
Kann mir einer erklären, was Ihr da gemacht habt? oder kann man das irgendwo nachlesen (ohne jetzt einen 3 Monatigen Lehrgang machen zu müssen)

Habe ja noch mehr Foren, wo ich vor dem gleichen Problem stehe. Da muss ich ja auch die Logos anpassen.

Ach und ist das jetzt responsive abgespeichert? oder muss ich da noch was machen?
Gruß Werner

Benutzeravatar
Dr.Death
Moderator
Moderator
Beiträge: 16216
Registriert: 23.04.2003 08:22
Wohnort: Xanten
Kontaktdaten:

Re: [3.3] Eigenes Logo funktioniert nicht

Beitrag von Dr.Death »

Das hat was mit SVG generell zu tun.

Die passenden SVG Bearbeitungsprogramme vorausgesetzt kann man viel machen.

Dein altes Logo hatte eine "feste" Höhe undBreite vorgeben:

Code: Alles auswählen

<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="612px" height="792px" viewBox="0 0 612 792" enable-background="new 0 0 612 792" xml:space="preserve">
Das "neue" Logo ist jetzt "repsonsive", da die Größenangaben relativ sind:

Code: Alles auswählen

<svg height="100%" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="100%" version="1.1" viewBox="0 0 153 114">
<defs/>

Lesestoff zu SVG:
https://de.wikipedia.org/wiki/Scalable_Vector_Graphics

wernerz
Mitglied
Beiträge: 95
Registriert: 22.10.2014 09:16
Kontaktdaten:

Re: [3.3] Eigenes Logo funktioniert nicht

Beitrag von wernerz »

Danke, hier lernt man auch immer wieder was dazu.
Habe jetzt mal noch die Buchstaben eingefärbt, da versteht man gleich etwas mehr.

Aber eine abschließende Frage habe ich noch:
Das Logo hängt im Augenblick unterhalb vom Text. Kann man das einstellen, dass die Oberkante des Logo zum rechts stehenden Text bündig ist?
Gruß Werner

Benutzeravatar
Dr.Death
Moderator
Moderator
Beiträge: 16216
Registriert: 23.04.2003 08:22
Wohnort: Xanten
Kontaktdaten:

Re: [3.3] Eigenes Logo funktioniert nicht

Beitrag von Dr.Death »

Eine auf 60px angepasste SVG Version:

Code: Alles auswählen

<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg height="100%" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linecap:round;stroke-linejoin:round;" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="100%" xmlns:vectornator="http://vectornator.io" version="1.1" viewBox="0 0 153 60">
<defs/>
<g id="Ebene_1_1_">
<path d="M97.6578+22.3609L92.8184+22.3609L100.67+6.71444L131.3+6.71444L142.835+22.3609L127.52+35.2314L136.726+52.8968L119.139+52.8968L112.268+41.6036L110.49+52.8968L92.6433+52.8968L97.6578+22.3609ZM114.896+19.9635L113.229+27.9967L122.97+20.2577L114.896+19.9635Z" fill-rule="evenodd" fill="#ffffff" opacity="1"/>
<path d="M15.9433+6.71444L35.6162+6.71444L33.7525+16.6903L41.5384+6.71444L79.3264+6.71444L74.5764+37.7551L95.0305+37.7551L90.9613+52.8968L35.1464+52.8968L28.8985+41.6351L26.8479+52.8968L9.80221+52.9915L14.9392+22.3609L9.67401+22.3609L15.9433+6.71444ZM54.2214+49.7897L59.4491+21.8562L55.4815+21.8562L58.4959+14.4983L44.8547+30.9413L54.2214+49.7897Z" fill-rule="evenodd" fill="#ffffff" opacity="1"/>
<path d="M17.8229+9.23804L14.0741+19.0802L18.3891+19.0802L13.2024+50.1209L24.2846+50.1209L27.5312+33.0863L37.2716+50.1209L51.6474+50.1209L41.8268+30.2157L59.0488+9.23804L43.1404+9.23804L29.2463+26.7568L32.1625+9.23804L17.8229+9.23804Z" fill-rule="evenodd" fill="#003e61" opacity="1"/>
<path d="M88.6436+50.247L91.3565+40.2787L71.1922+40.2787L76.0731+9.23804L63.5398+9.23804L59.4894+19.0093L62.7493+18.9959L56.9233+50.1209" fill-rule="evenodd" fill="#0a8f00" opacity="1"/>
<path d="M121.24+50.3732L112.033+34.9791L110.41+34.9791L107.868+50.3732L95.9919+50.3732L101.14+19.0802L97.5512+19.0802L102.528+9.23804L129.752+9.23804L139.07+21.4461L123.803+34.171L132.502+50.3732L121.24+50.3732ZM113.742+27.3239L122.201+20.342L115.024+20.342L113.742+27.3239Z" fill-rule="evenodd" fill="#c31c27" opacity="1"/>
<path d="M111.563+30.9413L113.913+19.0802L126.003+19.0802L111.563+30.9413ZM115.787+24.1274L118.067+22.3609L116.049+22.3609" fill-rule="evenodd" fill="#ffffff" opacity="1"/>
</g>
</svg>
Und dann mit der Höhen Werten in der Datei:
styles/prosilver/theme/common.css
herumspielen bis es passt:

Code: Alles auswählen

.site_logo {
	background-repeat: no-repeat;
	display: inline-block;
	width: 153px;
	height: 60px;
}

wernerz
Mitglied
Beiträge: 95
Registriert: 22.10.2014 09:16
Kontaktdaten:

Re: [3.3] Eigenes Logo funktioniert nicht

Beitrag von wernerz »

Hat Super funktioniert, Danke.
Gruß Werner

SL113
Mitglied
Beiträge: 6
Registriert: 15.07.2019 15:51

Re: [3.3] Eigenes Logo funktioniert nicht (erledigt)

Beitrag von SL113 »

Hallo Dr.Death,
so wie ich den Thread verstanden habe, passt das hier angegebene nur für das Logo von wernerz. Gibt es eine allgemeine Beschreibung, wie ein JPG-Logo in ein passendes SVG-Logo umgewandelt, und dann gegen das phpBB-Logo ausgetauscht werden kann?
Genügt es ein JPG in SVG mit einem Programm umzuwandeln, das Original-Logo dann gegen das eigene austauschen, oder muss hier mehr gemacht werden? Danke für Rückmeldungen.

Gruß
Jürgen

Antworten

Zurück zu „Styles, Templates und Grafiken“