- Étape 1 - Obtenir le code LinkWithin de son blog

Allez sur le site de LinkWithin↑,
→ indiquez votre email ainsi que le lien de votre blog dans les deux première cases.
→ Dans le cas d'OverBlog, choisissez "Other" dans Platform.
→ Width signifie le nombre de lien/image des articles similaire que vous voudrez, allant de 3 à 5.
→ Cochez la case que si vous avez une écriture blanche et par conséquent un fond sombre sur votre blog.
Après avoir cliqué sur Get Widget!, vous obtiendrez un code de ce style :

- Étape 2 - Introduire le code dans son blog

Pour introduire son code obtenu avec délicatesse, allez dans "Configurer" dans votre administration et créer un module "texte libre", mettez le en dessous du module Articles. Et bien sûr, copier coller dans le code source HTML du module fraîchement né.
/!\ Si vous avez déjà un module a cette emplacement, rajouter le code à la suite de ce que vous avez mit dedans.

- Etape 3 - Personaliser le widget dans le CSS

Nous voilà dans la partie la plus fun. Pour personnaliser entièrement Link Within, vous devez ajouter dans votre CSS ces quelques lignes :

/*------------------- linkwithin ----------------------------------*/

#lws_0
{background-color:#C3BAA4; border-top:1px solid #555555!important; border-left:0px solid #555555!important; border-right:0px solid #555555!important; margin-bottom:0px; margin-top:0px;}
/ Linkwithin dans sa globalité

#linkwithin_logo_0 b ,#linkwithin_logo_1 b ,#linkwithin_logo_2 b ,#linkwithin_logo_3 b ,#linkwithin_logo_4 b 
{color:#C3BAA4!important;}
/ le lien LinkWithin qui se situe en bas à droite

#linkwithin_text_0 , #linkwithin_text_1 ,#linkwithin_text_2 ,#linkwithin_text_3 ,#linkwithin_text_4
{color:#740007!important;padding-top:4px!important;margin-bottom:1px!important;font-family:Arial!important;font-size:11px !important; text-transform: uppercase!important; text-align : center !important ;}
/ le texte : "Vous aimerez peut-être:"

.linkwithin_posts a
{margin-left:10px!important; border-top:1px dashed #555555!important;}
/ le cadre comprenant l'image et le texte des articles similaires

.linkwithin_posts a:hover
{background-color:#E4DFD3!important; border-top:1px dashed #555555!important;}
/ le cadre comprenant l'image et le texte des articles similaires (au passage de la souris)

.linkwithin_posts a div
{color:#000!important;font-family:arial!important;font-weight:bold!important;}
/ le texte en dessous des images

.linkwithin_posts a:hover div
{color:#000!important;font-family:arial!important;font-weight:bold!important;}
/ le texte en dessous des images (au passage de la souris)

.linkwithin_outer
{margin-left:0px!important;}
/ appliquer un margin-left pour centrer toutes les images

.linkwithin_inner
{width:670px!important;}
/ l'intérieur de LinkWithin

/!\ A noter que les variables dans ces lignes sont celle du LinkWithin du blog.

- Dicaticiel par Alti Blue -
- Pour toutes questions, écrivez un commentaire. -