[3.2] Anpasssungswünsche für den style revolution

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
chris1278
Mitglied
Beiträge: 795
Registriert: 12.11.2007 06:20
Kontaktdaten:

[3.2] Anpasssungswünsche für den style revolution

Beitragvon chris1278 » 25.11.2017 05:46

Es handelt sich den Style "Revolution" aus der Style-Datenbank von phpbb.com

Hier zum Style auf Phpbb.com

Ich hätte die optik gerne etwas angepasst duch grafiken wie ich schon vorbereitet habe.

Siehe hier [ externes Bild ] und Hier: [ externes Bild ]

Wenn mir da jemand weiterhelfen könnte wäre ich sehr dankbar.

mfg

Benutzeravatar
chris1278
Mitglied
Beiträge: 795
Registriert: 12.11.2007 06:20
Kontaktdaten:

Re: [3.2] Anpasssungswünsche für den style revolution

Beitragvon chris1278 » 25.11.2017 08:36

So zwei sachen habe ich schon gefunden.

Um als Hintergrund ein Bild einzufügen:

In der coulours.css

suche folgendes:

Code: Alles auswählen

html, body {
   color: #5f6476;
   background-color: #2b2b2b;
}


ersetze mit:

Code: Alles auswählen

html, body {
   color: #5f6476;
   background-image: url("./images/background.gif");
}


Wobei hier der Pfad nur als Beispiel dient der Dateiname kann auch anders heissen je nachdem welches Bild man laden will.

Und für die Breite zu ändern:


In der common.css

finde:

.wrap {
border-radius: 10px;
border-style: solid;
border-width: 5px;
margin: 0 auto;
max-width: 800px;
padding: 5px 14px 5px 12px;
}



Passe dort den Wert "max-width: 800px;" an. anstelle 800 z.B. 1000 dann verbreitert es das Forum.

So fehlt nur noch der Rest

Lehrling
Supporter
Supporter
Beiträge: 2922
Registriert: 15.01.2012 20:00
Kontaktdaten:

Re: [3.2] Anpasssungswünsche für den style revolution

Beitragvon Lehrling » 25.11.2017 08:37

Finde in dem colours.css folgende Stellen und ändere sie entsprechend um:

Code: Alles auswählen

ul.forums {
   background-color: #EEF5F9; /* Old browsers */ /* FF3.6+ */
   background-image: -webkit-linear-gradient(top, #D2E0EB 0%, #EEF5F9 100%);
   background-image: linear-gradient(to bottom, #D2E0EB 0%,#EEF5F9 100%); /* W3C */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2E0EB', endColorstr='#EEF5F9',GradientType=0 ); /* IE6-9 */
}


Code: Alles auswählen

li.row:hover {
   background-color: #F6F4D0;
}

Benutzeravatar
chris1278
Mitglied
Beiträge: 795
Registriert: 12.11.2007 06:20
Kontaktdaten:

Re: [3.2] Anpasssungswünsche für den style revolution

Beitragvon chris1278 » 25.11.2017 15:21

Hallo Lehrling.

Das hier:

Code: Alles auswählen

li.row:hover {
   background-color: #F6F4D0;
}


Hab ich gefunden funktioniert auch. Effekt ist das dies die Farbangabe ist wenn man da mit der maus drauf fährt. Wo ist die farbe bevor man mit der maus drüber fährt.


Wie mus ich diesen code hier ersetzen:

Code: Alles auswählen

ul.forums {
   background-color: #EEF5F9; /* Old browsers */ /* FF3.6+ */
   background-image: -webkit-linear-gradient(top, #D2E0EB 0%, #EEF5F9 100%);
   background-image: linear-gradient(to bottom, #D2E0EB 0%,#EEF5F9 100%); /* W3C */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2E0EB', endColorstr='#EEF5F9',GradientType=0 ); /* IE6-9 */
}


Mein Ziel ist es eine Gif Grafik über den Forum anzubringen die etwa 60-70% der breite des bildschirms entspricht.

Also währen da angaben von:

Ausrichtung: ?
Höhe ?
Breite?
Ausdehnung auf Bildschirm links und rechts
Pfadangabe zur Datei denke ich müsste dann so aussehen: "background-image: url("./images/logo_header.gif");

Danke auf jeden fall für deine bzw. eure Hilfe.


Benutzeravatar
chris1278
Mitglied
Beiträge: 795
Registriert: 12.11.2007 06:20
Kontaktdaten:

Re: [3.2] Anpasssungswünsche für den style revolution

Beitragvon chris1278 » 25.11.2017 17:06

OK. Da sind einige Videos ich denke da komme ich schon mal ein ganz Stück mit weiter. Wenn noch was ist melod ich mich wieder.

Benutzeravatar
chris1278
Mitglied
Beiträge: 795
Registriert: 12.11.2007 06:20
Kontaktdaten:

Re: [3.2] Anpasssungswünsche für den style revolution

Beitragvon chris1278 » 26.11.2017 03:45

Danke Lehrling für die Videos. Dadurch hab ich einiges begriffen.

Aber ich finde immer noch nicht die eine Stelle wo das hier geeändert wird.

[ externes Bild ]

Die Farbeinstellung wo sich dort die Farbe ändert wenn man mit der Maus drüber fährt (hover effekt) hab ich gefunden.

Benutzeravatar
vfrblue
Junior Supporter
Beiträge: 798
Registriert: 22.11.2016 18:46
Wohnort: Niedersachsen-West
Kontaktdaten:

Re: [3.2] Anpasssungswünsche für den style revolution

Beitragvon vfrblue » 26.11.2017 04:34

Hallo,
öffne die colours.css und suche

Code: Alles auswählen

ul.forums {
    background-color: #EEF5F9;
    background-image: -webkit-linear-gradient(top, #D2E0EB 0%, #EEF5F9 100%);
    background-image: linear-gradient(to bottom, #D2E0EB 0%,#EEF5F9 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2E0EB', endColorstr='#EEF5F9',GradientType=0 );
}

Müsste ungefähr Zeile 316 sein. Hier kannst du dann die Farbe anpassen.
Wenn du den Farb-Effekt beibehalten möchtest, musst du beim background-image den Farbverlauf ändern. Möchtest du eine "statische" Farbe, dann background-color anpassen und 1x background-image ändern in

Code: Alles auswählen

background-image: none;

Den 2. "background"-Wert und den "filter" kannst du löschen.
Gruß Hermann

Forum VFR-OC
User: phpbbtest PW: vfroc

Benutzeravatar
chris1278
Mitglied
Beiträge: 795
Registriert: 12.11.2007 06:20
Kontaktdaten:

Re: [3.2] Anpasssungswünsche für den style revolution

Beitragvon chris1278 » 26.11.2017 05:34

ok. danke das hat weiter geholfen. Hab einfach bei den Farbverläufen alle vier werte Gleich gesetzt.


PS: Ich finde diese Videos echt hilfreich. Da lernt so einer wie ich ja doch noch etwas.


Zurück zu „Styles, Templates und Grafiken“