Overblog Suivre ce blog
Editer l'article Administration Créer mon blog

Créer une liste de blogs amis pour votre thème de Blog.

- Auteur : Brunofaisart

Créer une liste de blogs amis pour votre thème de Blog.

OB permet de créer un widget de sites de liens amis :
voir mon thème du Dimanche 26 Août.

Pour ceci il vous suffit juste avant la balise </HEAD> de copier le code ci-dessous.
Ce code est prévu pour afficher 5 liens de sites ou blogs amis et surtout les modifier sans avoir à toucher une ligne de code HTML. Mais il vous sera simple d'ajouter par copier coller autant de liens amis que souhaités.
Magique non! Il ma fallu un peu de temps pour maîtriser cette possibilité de la nouvelle plate-forme Overblog, qui permet de créer autant de Widget que nos besoins. L'on peut ainsi personnaliser un thème si en amont, celui-ci a été conçu pour être modifiable via des zones de paramétrages. Je reviendrais sur cette possibilités avec d'autres exemples de mini-widget...

<meta name="string:blogroll_1:Adresse du site internet #1" group="Sites Amis" />
    <meta name="string:blogroll_2:Adresse du site internet # 2" group="Sites Amis" />
	<meta name="string:blogroll_3:Adresse du site internet #3" group="Sites Amis" />
	<meta name="string:blogroll_4:Adresse du site internet #4" group="Sites Amis" />
	<meta name="string:blogroll_5:Adresse du site internet #5" group="Sites Amis" />

Puis dans le <BODY> de votre blog coller ce morceau de code qui permet l'affichage de vos liens. Positionnez le à un endroit stratégique de votre thème, par exemple en dessous de la liste de vos archives ou de vos catégories. Le code pour l'affichage ci-dessous

{% if isIndex %}
<ul class="list-2">
     {% if Custom('blogroll_1') is not empty %}
    		<li><a href="{{ Custom('blogroll_1') }}" title="{{ Custom('blogroll_1') }}" target="_blank">{{ Custom('blogroll_1') }}</a></li>
			{% endif %}
			{% if Custom('blogroll_2') is not empty %}
			<li><a href="{{ Custom('blogroll_2') }}" title="{{ Custom('blogroll_2') }}" target="_blank">{{ Custom('blogroll_2') }}</a></li>
			{% endif %}
			{% if Custom('blogroll_3') is not empty %}
			<li><a href="{{ Custom('blogroll_3') }}" title="{{ Custom('blogroll_3') }}" target="_blank">{{ Custom('blogroll_3') }}</a></li>
			{% endif %}
			{% if Custom('blogroll_4') is not empty %}
			<li><a href="{{ Custom('blogroll_4') }}" title="{{ Custom('blogroll_4') }}" target="_blank">{{ Custom('blogroll_4') }}</a></li>
			{% endif %}
			{% if Custom('blogroll_5') is not empty %}
			<li><a href="{{ Custom('blogroll_5') }}" title="{{ Custom('blogroll_5') }}" target="_blank">{{ Custom('blogroll_5') }}</a></li>
		{% endif %}
   </ul>
{% endif %}

Pour paramétrer vos liens cela ce fait dans la partie gauche de la gestion de votre thème voir la vidéo exemple sur l'intégration du Thème du Dimanche 26 Août

Suite au commentaire de MOUN sur ce post

A copier pour le thème Full Moon à mettre en dessous de la zone TAGS à droite

  {% if isIndex %}
<div class="box tags">
     <div class="box-titre">
         <h3>
             <span>Sites Amis</span>
         </h3>
     </div>
     <div class="box-content">   
        		<ul>
         {% if Custom('blogroll_1') is not empty %}
                <li><a href="{{ Custom('blogroll_1') }}" title="{{ Custom('blogroll_1') }}" target="_blank">{{ Custom('blogroll_1') }}</a></li>
                {% endif %}
                {% if Custom('blogroll_2') is not empty %}
                <li><a href="{{ Custom('blogroll_2') }}" title="{{ Custom('blogroll_2') }}" target="_blank">{{ Custom('blogroll_2') }}</a></li>
                {% endif %}
                {% if Custom('blogroll_3') is not empty %}
                <li><a href="{{ Custom('blogroll_3') }}" title="{{ Custom('blogroll_3') }}" target="_blank">{{ Custom('blogroll_3') }}</a></li>
                {% endif %}
                {% if Custom('blogroll_4') is not empty %}
                <li><a href="{{ Custom('blogroll_4') }}" title="{{ Custom('blogroll_4') }}" target="_blank">{{ Custom('blogroll_4') }}</a></li>
                {% endif %}
                {% if Custom('blogroll_5') is not empty %}
                <li><a href="{{ Custom('blogroll_5') }}" title="{{ Custom('blogroll_5') }}" target="_blank">{{ Custom('blogroll_5') }}</a></li>
            {% endif %}
       </ul>
   


     </div>
 </div>
 {% endif %}

Si vous voulez afficher la miniature de la page d'accueil du site ami il vous suffit de remplacer pour chaque lien défini au niveau de l'affichage, chaque <LI>[..]</LI>, par ceci :

{% if Custom('blogroll_1') is not empty %}
              <li><center><a href="{{ Custom('blogroll_1') }}" title="{{ Custom('blogroll_1') }}" target="_blank"><img src="http://www.photonautes-associes.fr/ob/ob_miniatureweb.php?url={{ Custom('blogroll_1') }}" style="border:0px;" align="absmiddle"/></a></center></li>
{% endif %}

Vous pouvez voir un exemple avec miniatures sur le site de MOUN :
http://versamoi.overblog.com/

Les commentaires...

comments powered by Disqus

Commentaires anciens formats...

didi 17/01/2013 22:26

Bonjour,
J'ai essayée de recopier comme vous l'indiquez mais je ni connais rien et donc rien ne ce passe. Je doit mal copier ou pas au bon endroit. Mon thème c'est Twenty Eleven. Pourriez vous aider une novice? Merci.

René Hammoudi 13/12/2012 15:46

Salut à tous.
Pour moi,il n'y a que trois(3) liens de sites amis qui s’affichent bien que j'en ai programmé cinq(5),et pourtant,j'ai appliqué le code proposé pour le thème Full Moon.
Is there any probleme ?

mamita92 24/10/2012 12:41

merci beaucoup de vos explications très claire.
J'ai réussi a installer le widget dans configuration..malheureusement avec mon thème cela ne fonctionne as ;-(. Mon thème actuel est photography! Dois utiliser les mêmes codes que pour moon? Merci en tout cas de vos explications........

Jean-Luc 21/10/2012 19:57

bonjour,
j'ai essayé de copier et coller les code comme vous l'expliquez, il ne se passe rien.
J'ai essayé sous IE, dans ce cas, 5 chiffres s'affichent en haut à gauche de ma page d'accueil.
Sous googlechrome, rien ne se produit.
Mon thème est: twenty eleven
Le nom de mon blog est: Monjardindansleslandes.overblog.com
Je vous remercie d'avance si vous pouvez m'aider.
Jean-Luc

Bruno admin créateur de ce blog 22/10/2012 12:50

Le problème des thèmes Overblog que les zones CSS n'ont pas toujours les mêmes noms, don dans votre cas la zone n'est pas
"box-tags"
...mais
"aside"

Je regarde comment vous proposer un code pour votre thème.

Evelyne (toujours la même) 05/09/2012 18:35

Je vais essayer ça aussi ! J'avais mis de liens dans "Goodies"....

Gregory 03/09/2012 01:38

Bonsoir,

Pour ma part, j'ai essayé de suivre vos instructions mais rien ne s'affiche sur ma page. Pouvez-vous m'aider ?

Merci

LADY MARIANNE 26/08/2012 16:39

http://ma-chienne-de-vie-test11.overblog.com/
le nom de ma base ??
je crois avoir compris-- j'y vais - merci pour vos captures d'écran !!

le banc moussu 28/08/2012 10:16

j'ai un peu la sensation que ceux qui y comprennent quelque chose ont déjà des bases et que les autres n'ont qu'à aller voir ailleurs, pourquoi faire simple quand on peut faire compliqué?
je suis certain que cette nouvelle plateforme est géniale pour ceux qui ont de temps à lui consacrer ou la volonté de comprendre le html. Pour moi le moindre petit truc est une montagne à soulever...
merci à toi en tous cas, quel courage de pallier aux manques d'o.b qui n'en a rien à faire.
belle journée
christian

LADY MARIANNE 26/08/2012 10:05

je suis arrivée à intégrer selon vos explications-
hélas je n'ai pas de colonnes- j'ai du louper une étape dans la config de mon blog-
merci pour ces bonnes explications-
bon dimanche à tous-

Bruno admin créateur de ce blog 26/08/2012 10:31

@LADY MARIANNE

Me rappeler le nom de votre thème de base, je vous dirais où positionner. :)

Moun 26/08/2012 09:46

Bonjour Bruno,

J'ai testé et si dans l'administration tout est correct, lorsque j'ai posé les lignes dans le body, aucun cadre de module n'est sorti, sans titre évidemment.. juste en couleur violette, deux liens que j'avais inséré... (full moon le design)

Bon dimanche et merci

Moun 26/08/2012 11:16

Merci Bruno... je laisse un peu comme ça, puisque tu as mis un lien de visualisation de mon pour les intéressés !

Bon dimanche

Bruno admin créateur de ce blog 26/08/2012 11:15

Modifier la structure du Widget, pour le moment celui ci-affiche soit l'adresse Web seule du site ami, soit la miniature de la page d'accueil du site ami.

Moun 26/08/2012 11:12

Je précise : faut-il retirer la partie insérée dans "body" ?

Moun 26/08/2012 11:10

Je te remercie Bruno... j'ai eu un coup au coeur en ouvrant mon blog... :)

Une question d'esthétique à ce sujet :
"Que faut-il modifier pour n'avoir qu'une ligne avec le nom du site ami cliquable ?"

D'avance merci

A bientôt

Bruno admin créateur de ce blog 26/08/2012 10:27

Voir le résultat sur ton blog MOUN, j'ai intégré :

http://versamoi.overblog.com/

Bruno admin créateur de ce blog 26/08/2012 09:58

@MOUN

J'ai ajouté sur ce post la version pour le thème Full Moon ici :

http://photonautesassocies.overblog.com/creer-une-liste-de-blogs-amis-pour-votre-theme-de-blog#fullmoon

Les 10 derniers Billets

Related Posts Plugin for WordPress, Blogger...