Design anpassen für Zitate

  • Seite 1 von 2
17.12.2013 09:51
avatar  dirk71
#1 Design anpassen für Zitate
di
Mitglied

Hi,

ich würde gern das Design für die Zitate von anpassen. Also das folgende Tag

[quote="Username"|Posting]

Dies würde ich gern über die Forumcodes abfangen.

Welche Variablen muss ich dafür abfragen?

[quote={{name}}|{{replyid}}]
Zitat.............
[/quote]
greift leider nicht.

Mein Ziel ist es ein Div Tag in das Zitat einzubauen, damit ich es besser formatieren kann.



</p><blockquote><font size="1">Zitat von <b>{{name}} </b> im Beitrag <b> {{message:quotelink}}</b></font><hr><div>
Zitat.............
</div><hr></blockquote><p>


 Antworten

 Beitrag melden
17.12.2013 10:23
avatar  Romulus
#2 RE: Design anpassen für Zitate
avatar
Mitglied

Noch einfacher wäre es, wenn Du das über einen CSS Eintrag abfragen lässt. Hat auch den Vorteil, dass Du in Zukunft dann immer sehr rasch weitere Anpassungen oder Veränderungen am Code vornehmen kannst.

Hier ein Beispiel, wie der Code dafür aussehen könnte. Die Farben und Werte kannst Du ganz nach Belieben einstellen:

1
2
3
4
5
6
7
8
9
10
11
 
/* Eintrag Anfang "Rahmen um Zitate in Beiträgen" */
blockquote {
background:#EDF9FA;
border-color:#004f80;
-webkit-border-radius:5px 5px 5px 5px;
border-radius:5px 5px 5px 5px;
padding:5px 10px 5px 10px;
border-style:solid;
border-width:1px;
}
/* Eintrag Ende "Rahmen um Zitate in Beiträgen" */
 



Eintragen müsstest Du den Code unter "Admin > Layout > Farben & Einstellungen > CSS" im Eingabefeld "Eigener CSS-Code". Danach noch speichern. Fertig!

www.neverface.com
Liebhaber des Business Templates

 Antworten

 Beitrag melden
17.12.2013 10:30
avatar  dirk71
#3 RE: Design anpassen für Zitate
di
Mitglied

Danke.

Mit der Lösung kann ich auch leben.


 Antworten

 Beitrag melden
17.12.2013 10:33
#4 RE: Design anpassen für Zitate
avatar
Mitglied

Ich habe die Zitate auch per CSS angepasst.
Der Code stammt aus dem Support-Forum hier.

1
2
3
4
5
6
7
8
9
10
11
 
blockquote {
border-color: #878787;
border-radius: 10px 10px 10px 10px;
border-style: solid;
border-width: 2px 2px;
box-shadow: 0 2px 15px;
-moz-box-shadow: 0 2px 15px;
-o-box-shadow: 0 2px 15px;
-webkit-box-shadow: 0 2px 15px;
-khtml-box-shadow: 0 2px 15px;
}
 



Ich finde die Darstellung sehr angenehm.

Gruß
Frank


Boardnr. 621181

www.aquariumzimmer.de
Boardnr. 572886
Business Template

 Antworten

 Beitrag melden
22.05.2016 19:24
#5 RE: Design anpassen für Zitate
avatar
Mitglied

Zitat von eini1971 im Beitrag #4
Ich habe die Zitate auch per CSS angepasst.
Der Code stammt aus dem Support-Forum hier.

1
2
3
4
5
6
7
8
9
10
11
 
blockquote {
border-color: #878787;
border-radius: 10px 10px 10px 10px;
border-style: solid;
border-width: 2px 2px;
box-shadow: 0 2px 15px;
-moz-box-shadow: 0 2px 15px;
-o-box-shadow: 0 2px 15px;
-webkit-box-shadow: 0 2px 15px;
-khtml-box-shadow: 0 2px 15px;
}
 



Ich finde die Darstellung sehr angenehm.




Ich habe diesen Code jetzt auch für meine Zitatfunktion übernommen, vielen Dank!

Leider ist der linke Randabstand vom Text zum Rand zu gering, siehe Bild.

Weiß jemand wie man den linken Seitenabstand zum Rand ändern, größer machen kann?

Themen:

 Antworten

 Beitrag melden
22.05.2016 20:10 (zuletzt bearbeitet: 22.05.2016 20:21)
avatar  River
#6 RE: Design anpassen für Zitate
avatar
Mitglied

Zitat von Scannerxy im Beitrag #5
Weiß jemand wie man den linken Seitenabstand zum Rand ändern, größer machen kann?


Probier's mal hiermit:

1
 
margin: 5px;
 



Da wo '5' steht, kannst du natürlich andere Werte einstellen. Damit kannst du den Abstand zur Box auf allen Seiten definieren.

Wenn's nicht geht - na ja - bin nicht grad der Programmierer hier. XD

Liebe Grüße
River

Edit: Kannst auch hier mal nachschauen.
Edit2: Also bei dir wäre das dann eher 'margin-left', aber ich finde, bei der Zitatbox ist ein gleicher Abstand überall am schönsten, weshalb ich dir das empfehle, was ich schon oben gepostet habe.
Edit3: Also, warum die 'em' nehmen und nicht 'px', das weiß ich grad' nicht (das hab ich aber schon mal wo nachgelesen^^). aber ich denk' mal, das ist HTML6 oder so und bei uns reicht HTML5 oder so, weshalb du das mit 'px' ruhig nehmen kannst. ;)
Edit 4: Kann auch sein, dass du statt 'margin' eben 'padding' nehmen musst - du probierst das jetzt und dann kannst du das in allen Variationen. ;)

-------------------------------------------------------------

+++Ich will Computercrack werden! XD+++

Business Template (v4)

 Antworten

 Beitrag melden
22.05.2016 20:26
#7 RE: Design anpassen für Zitate
avatar
Mitglied

Erst mal danke!

Es funktioniert leider nicht mit margin, so wie du beschrieben hast.
Wo muss ich das denn genau in den Code einfügen? Ich hab's an's Ende gesetzt, ohne Wirkung.

Themen:

 Antworten

 Beitrag melden
22.05.2016 20:35 (zuletzt bearbeitet: 22.05.2016 20:36)
avatar  River
#8 RE: Design anpassen für Zitate
avatar
Mitglied

Mach' das mal vor Zeile 7 rein. Und nicht aktualisieren vergessen.
Am besten machst du dein Forum zweimal auf - im einen änderst du den Code und speicherst. Im anderen schaust du dir die Auswirkung an.

Mal sehen, was passiert. Wenn später Olaf da ist, kann der da sicher besser weiter helfen.

Andererseits ist so ein büschen Autodidaktik auch mal schön. ;)

Liebe Grüße
River

@Olaf: Kannst du bitte aushelfen? Du siehst ja, dass meine 'Hilfe' nur ungenügend ist. Danke dir. ;)

-------------------------------------------------------------

+++Ich will Computercrack werden! XD+++

Business Template (v4)

 Antworten

 Beitrag melden
22.05.2016 20:36
#9 RE: Design anpassen für Zitate
Mi
Mitglied

"Padding" ist's

Vielen lieben Dank dafür, habs gerade auch eingebaut.


 Antworten

 Beitrag melden
22.05.2016 20:37 (zuletzt bearbeitet: 22.05.2016 20:38)
avatar  River
#10 RE: Design anpassen für Zitate
avatar
Mitglied

Oh, das freut mich aber. Dankeschön fürs Feedback.

Liebe Grüße
River

-------------------------------------------------------------

+++Ich will Computercrack werden! XD+++

Business Template (v4)

 Antworten

 Beitrag melden
22.05.2016 20:56 (zuletzt bearbeitet: 22.05.2016 20:57)
#11 RE: Design anpassen für Zitate
avatar
Mitglied

Ich hab's jetzt vor Zeile 7 drin und mit verschiedenen Werten ausprobiert.
Der Abstand des Textes in der Zitatbox ändert seinen Abstand nicht und bleibt linksbündig. Menno......

Themen:

 Antworten

 Beitrag melden
22.05.2016 21:00
avatar  River
#12 RE: Design anpassen für Zitate
avatar
Mitglied

Kannst du deinen kompletten Code mal hier posten? In den code-Tags?

Dann kann sich das einer der Könner hier das vllt mal anschauen. ;)

Danke.

Liebe Grüße
River

-------------------------------------------------------------

+++Ich will Computercrack werden! XD+++

Business Template (v4)

 Antworten

 Beitrag melden
22.05.2016 21:02
#13 RE: Design anpassen für Zitate
avatar
Mitglied

Klar, hier ist der Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
div blockquote {
color: #000000 !important;
background-color : #e0e0e0;
font-family : Comic Sans MS;
 
}
 
blockquote {
border-color: #878787;
border-radius: 10px 10px 10px 10px;
border-style: solid;
border-width: 2px 2px;
box-shadow: 0 2px 15px;
-moz-box-shadow: 0 2px 15px;
-o-box-shadow: 0 2px 15px;
-webkit-box-shadow: 0 2px 15px;
-khtml-box-shadow: 0 2px 15px;
 
}
 
 

Themen:

 Antworten

 Beitrag melden
22.05.2016 21:25
#14 RE: Design anpassen für Zitate
Mi
Mitglied

1
2
3
4
5
6
7
8
9
10
11
12
13
 
blockquote {
border-color: #b0bdbc;
border-radius: 10px 10px 10px 10px;
border-style: solid;
border-width: 2px 2px;
box-shadow: 0 2px 15px;
-moz-box-shadow: 0 2px 15px;
-o-box-shadow: 0 2px 15px;
-webkit-box-shadow: 0 2px 15px;
-khtml-box-shadow: 0 2px 15px;
padding: 15px;
 
}
 



so hab ich den Code bei mir eingebaut.
padding, statt margin ....

ich hab nur die Pixel geändert und den Farbcode meinem Forum angepaßt ansonsten passt alles einwandfrei


 Antworten

 Beitrag melden
22.05.2016 22:38
#15 RE: Design anpassen für Zitate
avatar
Mitglied

@River
@MissSofie

Ihr seid klasse!
Jetzt funktioniert es.

Dankeschöööön!

Themen:

 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!