Utiliser les résumés d'articles à la place du module Articles Récents

Publié dans : Design et Mise en page - OB

Utiliser les résumés d'articles à la place du module Articles Récents

Je voulais placer mon module Articles Récents en colonne principale, mais mon design est élastique, ce qui rendait l'opération compliquée (ajustement sous les différentes résolutions d'écran).

Ci-dessous les News :

Vous devez être en mode avancé pour réaliser cette astuce : Configurer - Mode avancé - Passez en mode avancé

1ère étape dans Configurer - onglet Accueil - Petit marteau en haut à droite de l'article

Vous ne mettez aucune étiquette : ni date, ni communauté, ni commentaires, ni recommander
Vous sélectionnez le nombre d'articles voulu
Vous demandez un affichage du plus récent au plus ancien
Vous cochez Résumés d'Articles
Nombre de caractères par résumé : 0

2ème étape : vous allez dans le CSS Accueil : Design - Mode avancé - Accueil

Ces lignes sont à compléter ou à créer

Je diminue l'espacement entre les titres des articles. Jouez avec le nombre de px

.extraitArticle {margin-bottom: -10px;}

J'encadre et je mets un fond dans ce pavé

.articles {border: 5px double #000033; background:url(adresse du fond);}

Il se peut que la 1ère image des articles apparaissent

.articles img {display:none;}

Pour faire disparaître la ligne entre les articles

.hrExtrait {display:none;}

Vous pouvez vouloir distinguer les lignes

Pour les lignes impairs

.article_summary_even .titreExtrait {color:#000033;background-color:#f5f5dc;}

pour les lignes pairs

.article_summary_odd .titreExtrait {color:#f5f5dc;background-color:#000033;}

Vous souhaitez mettre en titre de ce pavé "News" ou Nouveauté
Vous créez une image avec fond transparent :

#extraitArticle1 {background:url(adresse de cette image); background-repeat:no-repeat;background-position:center top; padding-top:30px;}

padding-top correspond à la hauteur de cette image

Vous souhaitez mettre une ligne de séparation entre ce titre et le 1er article

#extraitArticle1 .infoExtrait {border-top:3px double #000033;padding-top:10px;}

A ce niveau-là, votre pavé des nouveautés devrait déjà avoir de l'allure.

Voir les 4 commentaires - Ecrire un commentaire
Recommander

Précédent : Créer une ligne de séparation dans... Retour à l'accueil Suivant : Créer des tags technorati - Privilège

Commentaires

le retour est imminent chère Anna et je n'ai pu te souhaiter du soleil, mais je sais qu'il y en a eu même si les températures n'ont pas été caniculaires. Vivement que tous les blogueurs rentrent de vacances, ou bien retrouvent simplement leur bécane après l’avoir un peu délaissée en été. Oui la blogosphère est triste, et moi la première, je n’ai pas été assidue auprès de mes amis blogueurs. Donc un petit passage pour me faire pardonner. Un été, un été de plus, et le cycle des saisons et de la vie continue inexorablement. Ne vas pas en déduire que je suis triste, pas du tout, juste un peu impatiente (comme toujours). Je t’embrasse, à bientôt.

Commentaire n° 1 posté par stella

le 25/08/2008 à 10h24

Coucou Anna.k Je vois que toi aussi tu es parti en vacances ! J'espère qu'elle étaient bonnes ! Un peu de repos ne fait de mal à personne :) En effet je suis revenue le 25 mais je viens d'apprendre qu'on pouvait programmé la publication des articles ! je ferais ça la prochaine fois. Bisoux et bonne soirée.

Commentaire n° 2 posté par Flo le 26/08/2008 à 00h16

bonsoir Annack j'ai suivi toutes les instructions et impeccable j'aurais voulu savoir comment faire pour mettre un petit gif ou un bouton devant le titre du résumé si c'est possible bien entendu je continue ma balade je vais voir ce que je peux faire pour le titre de l'album photo merci encore bisounours de bonne soirée de mon z'ours (autre blog)

Commentaire n° 3 posté par z'ours le 05/01/2009 à 20h23

coucou c'est remoi zut ça ne fait pas trop bien car ma colonne de droite et plus longue que la page centrale avec mon article ... je remets comme avant dommage je trouvais cette astuce sympa re bisounours de mon z'ours

Commentaire n° 4 posté par z'ours le 05/01/2009 à 21h02