Kreis mit Hover-Effekt auf Wordpress-Blog

**Accountuser** · 06.06.2014, 16:24

Hallo Forum,

ich würde gerne 4 Kreise mit einem Hover-Effekt auf meinen Wordpress-Blog anbringe, so wie auf dem nachfolgenden Link (Unique Design, Photo Gallery, Appointment System, Custom Service Page):

Beauty Salon Responsive Wordpress Template Preview - ThemeForest

Ich habe versucht, den Quelltext auszulesen, bin aber hier nicht weitergekommen, da ich nicht weiß, welcher Teil des Quelltextes hier relevant ist.

Kann mir hier jemand helfen bzw. kennt jemand ein WP-Plugin, mit dem man solche "Kreise" generieren kann?

Für Eure Hilfe besten Dank im voraus.

**Chrissy** · 06.06.2014, 23:39

Suchen solltest du auf dieser Seite ,wenn du schon den Quelltext durchsuchst . Beauty Salon Wordpress Theme

Du brauchst diese Css datei , http://beauty-salon-wordpress-theme..../css/theme.css

und diesen Html code.



<div class="uk-width-1-1 uk-width-medium-1-4"><div class="uk-panel uk-panel-box box-rounded widget_text uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-slide-left" data-uk-scrollspy="{cls:'uk-animation-slide-left'}" style="min-height: 216px;"><h3 class="uk-panel-title"><i class="uk-icon-eye"></i> Unique Design</h3><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <span class="uk-hidden-medium">Aenean commodo ligula eget dolor.</span></p>

<a href="#" class="uk-hidden-medium">Read More...</a></div></div>

das unwichtige muss du allerdings selber wegschneiden .

Hier nochmal der ganze code mit eingebundener css datei :



<html><head><link rel="stylesheet" href="/wp-content/themes/BeautySalon/css/theme.css"></head><body>

<div class="uk-width-1-1 uk-width-medium-1-4"><div class="uk-panel uk-panel-box box-rounded widget_text uk-scrollspy-init-inview uk-scrollspy-inview uk-animation-slide-left" data-uk-scrollspy="{cls:'uk-animation-slide-left'}" style="min-height: 216px;"><h3 class="uk-panel-title"><i class="uk-icon-eye"></i> Unique Design</h3><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <span class="uk-hidden-medium">Aenean commodo ligula eget dolor.</span></p>

<a href="#" class="uk-hidden-medium">Read More...</a></div></div>

</body></html>

**Accountuser** · 07.06.2014, 14:51

Hallo Chrissy,

herzlichen Dank für die Info. Ich habe es genauso gemacht. Jetzt habe ich noch eine Frage (bin blutiger WP-Anfänger): Wie binde ich jetzt die "theme.css" in WP ein? Ich habe bereits gegoogelt, aber so richtig schlau werde ich nicht.....

Für Deine Bemühungen besten Dank!

Viele Grüße
AU

**Chrissy** · 07.06.2014, 18:18

einfach den dazugehörigen Abschnitt aus dem CSS Datei rausuchen und in deiner CSS Datei einfügen währe wohl der einfachste / sauberste weg .

**qmiq** · 08.06.2014, 11:20

oder im html code direkt einbinden - suche am besten mal nach "selfhtml Stylesheets in HTML einbinden"

Scheint aber so, als ob du keinerlei Erfahrung hast, vielleicht sind solche Sachen dann evtl. etwas zu komplex. Um dir websiten anzugucken, kann ich dir im Firefox "firebug" als Plugin empfehlen, im Chrome gibt es zwar schon sowas von Hause aus, aber finde firebug da ne Nummer besser.

U-Labs

Account-Boerse

U-IMG

Thema: Kreis mit Hover-Effekt auf Wordpress-Blog

Kreis mit Hover-Effekt auf Wordpress-Blog

AW: Kreis mit Hover-Effekt auf Wordpress-Blog

The Following User Says Thank You to Chrissy For This Useful Post:

AW: Kreis mit Hover-Effekt auf Wordpress-Blog

AW: Kreis mit Hover-Effekt auf Wordpress-Blog

The Following User Says Thank You to Chrissy For This Useful Post:

AW: Kreis mit Hover-Effekt auf Wordpress-Blog

The Following User Says Thank You to qmiq For This Useful Post:

Ähnliche Themen

Suche Effekt für ein Bild

[HOW TO] Matrix Effekt

VB.Net TextBox Mouse Hover Info anzeigen?

Teamspeak 3 Symbol im Kreis

Farid Bang DLTDL Blog Nr. 3 DER LETZTE BLOG DEINES LEBENS Nr. 3