Skapa unika widgets i Wordpress

Tråden skapades och har fått 10 svar. Det senaste inlägget skrevs .
1

Hej,

Jag är på god väg att skapa en tillfredställande sidebar i Wordpress. Vissa "Widgets" jag använder, inkluderar en användbar CSS.

Däremot har jag några widgets, som erbjuder en perfekt funktion - men som ärver temats CSS.

T.ex. så vill jag använda en skribentbild som fyller sidebarens 300px kant till kant. Men mitt tema har bestämt sig för att "padda" in allt innehåll cirka 25px.

Detta är såklart användbart på widgets som listar något - men inte just för den här widgeten.

Någon som har en idé hur jag kan köra över temats diktatur?

Mvh

  • Medlem
  • Bollnäs
  • 2010-06-05 08:43

Gör en till CSS som du länkar sist i <head> (en funktion i functions.php t ex som hook:ar på wp_head) och gör en regel som pekar exakt på manickens plats i DOM. Har den någon class eller ett id använder du med fördel det.

Ursprungligen av Kalle W:

Gör en till CSS som du länkar sist i <head> (en funktion i functions.php t ex som hook:ar på wp_head) och gör en regel som pekar exakt på manickens plats i DOM. Har den någon class eller ett id använder du med fördel det.

När jag kollar i functions.php så hittar jag följande rader (de enda som berör widgets):

if ( function_exists('register_sidebar') )
    register_sidebar(array(
		'name' => 'Sidebar',
        'before_widget' => '<div class="widget">',
        'after_widget' => '</div>',
        'before_title' => '<h3>',
        'after_title' => '</h3>',

Den widget jag vill styla har mycket riktigt en Div vid namn div.yd_rp_widget

Ursprungligen av Kalle W:

Gör en till CSS som du länkar sist i <head> (en funktion i functions.php t ex som hook:ar på wp_head) och gör en regel som pekar exakt på manickens plats i DOM. Har den någon class eller ett id använder du med fördel det.

Kan heller inte finna <head> i min functions.php

  • Medlem
  • Bollnäs
  • 2010-06-06 11:42
Ursprungligen av godpuppet:

Kan heller inte finna <head> i min functions.php

Det är alltså <head> i html-koden jag menar.

Så här menar jag:

<?php

/*

Extra CSS för att formge specifik widget.
De CSS-regler som anges skrivs ut i (slutet på) <head> på varje sida på sajten.
Se temats mall för <head> och leta efter <?php wp_head(); ?> för att se
exakt var reglerna kommer att skrivas ut.
 
@package: godpuppets tema
@apply to: wp_head
@return: string

*/

function godpuppet_custom_widget_style(){
	echo "
div.yd_rp_widget { margin: 0; }
div.yd_rp_widget img { margin: 0; }
	";
}
add_action('godpuppet_custom_widget_style', 'wp_head');

?>

Lägg det i din functions.php och byt ut CSS-reglerna så att de gör det du vill att de ska göra (svårt att veta hur de ska se ut eftersom jag inte sett sajten).

Ursprungligen av Kalle W:

Det är alltså <head> i html-koden jag menar.

Så här menar jag:

<?php

/*

Extra CSS för att formge specifik widget.
De CSS-regler som anges skrivs ut i (slutet på) <head> på varje sida på sajten.
Se temats mall för <head> och leta efter <?php wp_head(); ?> för att se
exakt var reglerna kommer att skrivas ut.
 
@package: godpuppets tema
@apply to: wp_head
@return: string

*/

function godpuppet_custom_widget_style(){
	echo "
div.yd_rp_widget { margin: 0; }
div.yd_rp_widget img { margin: 0; }
	";
}
add_action('godpuppet_custom_widget_style', 'wp_head');

?>

Lägg det i din functions.php och byt ut CSS-reglerna så att de gör det du vill att de ska göra (svårt att veta hur de ska se ut eftersom jag inte sett sajten).

Tack! Håller på att testa ovanstående. Passar på att fråga ytterligare om widgets. Ser promotionartiklar på flera olika wp-siter likt Dagens Arena – Oberoende, radikal och progressiv
Titta i headern, till höger om logo, så visas senaste blogginlägg från en skribent. Har du någon aning om vad widgeten heter, eller måste man knacka själv?

Mvh

  • Medlem
  • Bollnäs
  • 2010-07-02 18:34

Jag tror inte det är en widget. Skulle jag gjort det själv hade jag använt WP_Query() och gjort en till loop för just den puffen. Just WP_Query finns förklarat här, och hur man gör multipla loop:ar här.

Jag har själv gjort en liknande sak på Macbloggen där förstasidan består av inte mindre än fem loop:ar.

Ursprungligen av Kalle W:

Jag tror inte det är en widget. Skulle jag gjort det själv hade jag använt WP_Query() och gjort en till loop för just den puffen. Just WP_Query finns förklarat här, och hur man gör multipla loop:ar här.

Jag har själv gjort en liknande sak på Macbloggen där förstasidan består av inte mindre än fem loop:ar.

Snygg sida!

Gäller det även för Nya Affärer (kika på Bloggar & Åsikter). Man kan ju tycka att WP borde kunna erbjuda ett likande tillägg?

  • Medlem
  • Bollnäs
  • 2010-09-02 01:30

I koden ser det ut att vara en widget, men jag skulle gissa att den är hemmasnickrad (utan att för den skull ha en aning).

Men, som sagt, jag skulle gjort det med en separat loop och använt WP_Query(). Inte speciellt svårt alls.

  • Medlem
  • Landskrona
  • 2010-09-23 10:53
Ursprungligen av Kalle W:

I koden ser det ut att vara en widget, men jag skulle gissa att den är hemmasnickrad (utan att för den skull ha en aning).

Men, som sagt, jag skulle gjort det med en separat loop och använt WP_Query(). Inte speciellt svårt alls.

Ja, det är en hemmasnickrad widget på Nya Affärer, (det är jag som gjort den). Den hämtar de senaste inläggen från en kategori och visar "author", titel och utvald bild nerskalad till lämplig storlek.

Ursprungligen av Windy:

Ja, det är en hemmasnickrad widget på Nya Affärer, (det är jag som gjort den). Den hämtar de senaste inläggen från en kategori och visar "author", titel och utvald bild nerskalad till lämplig storlek.

Kul! Riktigt snyggt WP-projekt f.ö. Håller på att skapa en liknande funktion.

1
Bevaka tråden