Rahmen um Bilder

simon733

Hallo,
habe bereits die Suchfunktion bereits benutzt, aber nichts rausgefunden.

Folgendes Problem:
Ich möchte alle Bilder, die ich veröffentliche, automatisch mit einem Rahmen versehen haben (grau, in kleinem abstand zum bild).

Wie stelle ich das an? Habe schon öfters von verschiedenen CSS-Befehlen gelesen, weiß aber nicht wo ich die einsetzen soll.... Leider habe ich keine Ahnung von CSS.

Das Blog ist noch in der Aufbauphase und ist unter Ganz unten zu finden.

Wäre froh über Hilfe - hoffe ich habe alles verständlich dargestellt.

Grüße

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

flobster

In deiner style.css fügst du z.B. ein:

Code

img { padding: 5px; border: 1px solid #CCCCCC; }

Schau aber vorher mal, welche Einstellungen ggf. schon vorhanden sind.

gsibergerin

Hallo, Simon!
Ich mache das auf meinem Blog so:

HTML

img {border: 1px solid #999999; padding: 5px;}

Diese Anweisung schreibst du in deine CSS-Datei. Aber Achtung: Sie versieht alle (!) Bilder mit diesem Rahmen, auch z.B. Gravatare. Willst du das für bestimmte Bilder nicht haben, muss die Anweisung für diese mit border:none wieder aufgehoben werden.

simon733

Danke für die nette Hilfe :-)

flobster

Unglaublich! Sozusagen zeitgleich nahezu dieselbe Antwort...

maxe

naja, bei der border-Farbe hättet ihr euch noch vorher absprechen können :mrgreen:
Obwohl grau ist's ja beides ;-)

gsibergerin

Na ja, er hat sich ja auch nicht festgelegt, was das Grau betrifft... ;-)
Und wie´s aussieht, sollten Helfer im Forum manchmal wenigstens ein WENIG Gedankenübertragung beherrschen - flobster, wir können´s! :mrgreen:

simon733

hallo,
habe jetzt ein weiteres problem:

einfache bilder haben jetzt einen netten rahmen, dass hat gut geklappt.

allerdings: wenn ich eine galerie erstelle, ist der rahmen zu fett und passt nicht zum bild (siehe auf Ganz unten ).

meine frage: wie kann ich

den rahmen bei galeriebildern (farbe, größe, etc.) ändern?
die größe der galeriebilder (in der voranzeige) ändern?

habe schon mal im quelltext gesucht, aber nichts gefunden.

grüße,
simon

gsibergerin

Das liegt daran, dass deine Gallerie-Bilder eine andere Klasse haben, nämlich .gallery img. Das ist nicht in deiner style.css. Ist das ein Plugin, das du da verwendest?
Die Bilder überschneiden sich da auch so seltsam. Die Größe der Vorschaubilder stellst du in Wordpress selbst ein: Einloggen - Einstellungen - Verschiedenes - Größe Vorschaubild (standardmäßig auf 150 mal 150). Probier mal diese Größe aus. Oder - wenn es ein Plugin ist - in den Plugin-Einstellungen selbst. Du hast jetzt übrigens in deiner style.css zwei mal img drin, das neue ganz unten, das ursprüngliche weiter oben - lösche dieses, wenn du den Rahmen behalten möchtest.

flobster

Zitat

den rahmen bei galeriebildern (farbe, größe, etc.) ändern?

füge mal dies hier in deine style.css ein und passe es entsprechend an:

Code

.gallery img {wordpress (Linie 88)
border:2px solid #CFCFCF;
}

Zitat

die größe der galeriebilder (in der voranzeige) ändern?

Die Standard Größe der Bilder kannst du unter Einstellungen->Verschiedenes finden. In deiner CSS scheint aber einiges durcheinander, die Bilder überlappen sich ja gegenseitig.

Code

.gallery-item {wordpress (Linie 83)
float:left;
margin-top:10px;
text-align:center;
width:33%;
}

Ersetze hier mal width: 33% durch die Breite deiner Bilder in Pixel, z.B. width: 150px.

Wie ich mal wieder sehen muss: Spitzenservice hier...

gsibergerin

@ flobster:
Hey, das wird jetzt langsam unheimlich! ;-)

simon733

hallo gsibergerin, hallo flobster,

danke für die tipps!

das mit der kleineren vorschau hab ich soweit hinbekommen - das mit dem rand leider nicht, der ist mir immer noch zu dick.

die genannten codes (von flobster) habe ich in die style.css eingefügt, hat aber nichts bewirkt!

grüße
simon

Monika

WP schreibt bei der Galerie Funktion eigene CSS ANgaben völlig falsch in das html :(

Code

<style type='text/css'>
			.gallery {
				margin: auto;
			}
			.gallery-item {
				float: left;
				margin-top: 10px;
				text-align: center;
				width: 33%;			}
			.gallery img {
				border: 2px solid #cfcfcf;
			}
			.gallery-caption {
				margin-left: 0;
			}
		</style>
		<!-- see gallery_shortcode() in wp-includes/media.php -->

Alles anzeigen

entweder in der angegebenen Datei ändern und dies bei jedem update oer damit leben

tut mir leid ich urgier dies schon seit wp 2.5 , aber dies ist den developern vermutlich ein zu kleines Problem

lg

simon733

hallo monika,
kann dir - wahrscheinlich mangels css-routine - leider nicht ganz folgen..

was ist mit der "angegebenen datei" gemeint? die style.css?

finde nämlich in der style.css nicht einmal das wort "gallery", es scheint also dazu gar nix geschrieben zu sein....

was muss ich konkret machen, um den rand zu schmälern (möglichst auf 1px), und wo?

updates sind für mich bis jetzt nicht so wichtig - würde einfach die version beibehalten, solange das optisch alles klappt.....

grüße

S.i.T.

Zitat von gsibergerin
Hallo, Simon!
Ich mache das auf meinem Blog so:
HTML
img {border: 1px solid #999999; padding: 5px;}
Diese Anweisung schreibst du in deine CSS-Datei...

Fein, vielen Dank. Ein Teil des Schnipsel habe ich gesucht und hier gefunden. :-)

Code

/* thumbnail styles */
        .wpp-thumbnail {
            display:inline;
            float:left;
            margin:0 5px 0 0;
            border:2px solid #CCCCCC;

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Rahmen um Bilder

Jetzt mitmachen!