Colorwave – Premium Wordpress Theme

Transcription

Colorwave – Premium Wordpress Theme
Colorwave – Premium Wordpress Theme
Description :
14 Template Colors (Blue,Pink,Green…)
3 Highlight Sliders :
- Nitrografix Slider
- Nivo Slider
- Piecemaker 3D
French Language Package
2 Blog Type (Classic/Magazine)
Full Custom Sidebars
7 Custom Widgets:
-
Twitter Feeds
FlickR Feeds
Popular Posts
Recent Posts
Recent Comments
Contact Form
Recent Galleries
Page Templates:
- Full Width (no Sidebar)
- Sitemap
- Service
- Gallery

-
Lightbox (prettyPhoto) Effect Pop-up Images
Portfolio
404 Error Page
30+ Custom Style Shortcodes ( Slideshow, Tabs, Messages, Videos…) with admin Panel
jQuery Drop-down menu
Font Replacement (Cufon) with 4 custom Fonts
Breadcrumb Navigation
Social Bookmarking
“About Author” Box on Posts
Extensive Documentation ( FR included )
Theme / Slideshow Admin Panel
Layered PSDs are included for easy modification
1
Thème Colorwave
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
Installation
Options du Thème (Onglet Colorwave)
1. Options Générales
2. Page d’accueil
3. Blog
4. Sidebars
Options du Slider (Onglet Colorwave Slider)
Custom Widgets
Shortcodes
Articles
Pages
Galerie
Portfolio
Service
Ressources externes
Résumé
1. Installation
Pour installer le thème Colorwave, il vous suffit de copier le répertoire « colorwave » dans le dossier /wpcontent/themes/ de votre Wordpress.
Attention : Vous devez mettre le dossier /wp-content/themes/colowave/lib/cache en mode 777 (sinon le
cache de Twitter et des Images ne va pas fonctionner).
Ensuite connectez vous à l’administration et allez dans le menu Apparence >> Thèmes et cliquez sur Activer
en dessous de l’image correspondant au thème disponible Colorwave.
Deux onglets « Colorwave » et « Colorwave Slider » sont apparus dans le menu d’administration de gauche
en bas.
Cliquez sur « Colorwave » pour démarrer les réglages du thème.
L’onglet « Colorwave Slider » sert à paramétrer le Slider disponible en page d’accueil.
2. Options du thème
2.1 Options Générales
Url du logo
Entrez l’URL complète de votre logo que vous avez préalablement uploadé sur votre serveur.
La taille maximale est de 220px / 70px.
2
Exemple : http://www.tonsite.com/images/tonimage.png
Couleur du Template
Vous avez ici le choix entre plusieurs couleurs pour votre site.
Tip : Ces couleurs sont disponibles dans le répertoire /colorwave/lib/skins/ sauf bleu qui est la couleur
par défaut.
Désactiver Cufon?
Cufon est un plugin javascript de remplacement automatique de texte en image. Il permet d’obtenir un
meilleur rendu du texte que le rendu navigateur.
http://cufon.shoqolate.com/generate/
Polices pour Cufon
4 polices différentes sont disponibles. Choisissez celle qui vous plait le plus.
Tip : Option non disponible si vous désactivez Cufon.
Désactiver le fil d’Ariane?
Vous pouvez ici désactiver l’affichage du fil d’Ariane situé sous le menu.
Favicon
Entrez l’URL complète de votre favicon que vous avez préalablement uploadé sur votre serveur.
Exemple: http://www.tonsite.com/images/favicon.png
Copyright en pied de page:
Insérer votre copyright ici, il apparait sous le ‘Propulsé par Wordpress’.
Tip : La balise html span permet de coloriser le texte avec la couleur du Template préalablement définie.
Exemple: Copyright 2010 <span>thème Granity</span>
Code Tracking
SI vous souhaitez insérer un code (de suivi de Google Analytics par exemple), copiez-le à cet endroit.
2.2. Page d’accueil
Activer les articles en page d’accueil :
Si vous souhaitez que vos articles soit visibles dès la page d’accueil, cochez cette case. Par défaut, l’option
est cochée.
3
Page inclue dans la page principale :
Pour changer le contenu de la page principale, vous pouvez sélectionner une page à inclure (son
contenu).
Tip : Option non disponible si vous activez les articles en page d’accueil.
2.3 Blog
Page du blog:
Sélectionner la page où vos articles seront affichés. Par défaut, les articles sont affichées sur la page
d’accueil donc ici aucune page n’est sélectionnée.
Type du blog:
Deux Options sont disponibles : Classique et Magazine.
Classique affiche les articles l’un en dessous de l’autre avec l’image à la Une de 485 x 188px.
Magazine affiche le premier article en taille … et les second l’un à coté de l’autre avec une image de
taille...
Description de l'auteur désactivée?
Cochez cette case si vous souhaitez désactiver la description de l’auteur. (affichée en dessous de chaque
article, et au niveau des archives d’auteur).
Désactiver le partage social:
Cochez cette case pour désactiver les icones de partages sociaux affichés dans le bas de chaque article.
(twitter, stumble upon, reddit, digg, delicious, facebook, linked in)
Icones Sociaux :
Cochez les réseaux sociaux que vous souhaitez lier à chaque article. Par défaut, tous les réseaux sont
cochés.
Tip : Option non disponible si vous désactivez le partage social.
2.4 Navigation
Pages exclues du menu principal :
Cocher les pages que vous ne souhaitez pas voir apparaitre dans le menu principal.
Liens inclus dans le bas de page
4
Vous pouvez créer facilement un menu en pied de page, il vous suffit de cochez les liens que vous
souhaitez voir visible en pied de page. (à droite du copyright)
Nombre d’archive par page
Vous pouvez définir un nombre d’article par page dans les archives. Par défaut, le nombre par page est de
20.
Tip : Cette option définie également le nombre d’objet par page lors de la recherche.
2.5 Sidebars
Ce thème autorise les customs sidebars. Vous pouvez en créer autant que voulu.
Pour en créer une, il suffit de remplir le champ de texte « Nom de la sidebar » puis de cliquer sur le bouton
« Ajouter une sidebar » situé à droite.
Pour en supprimer une, il vous suffit de cliquer sur le bouton « Supprimer cette sidebar » à droite de chaque
sidebar.
Tip : Vous n’avez pas besoin de cliquez sur le bouton général « Sauvegarder » pour sauvegarder les
changements faits dans les sidebars (Ajax Actions).
---En bas de chaque édition d’articles, de pages ou de galeries, cet onglet « Sidebars » est présent. Il vous
permet facilement de définir une sidebar de remplacement à la sidebar par défaut ou bien de désactiver
une sidebar.
Tip : Si vous désactiver une sidebar du bas de page, toutes les sidebars du page de page seront
désactivées.
Tip : Vous pouvez également choisir la position (gauche/droite) de la sidebar principale pour chaque page.
(par défaut à droite).
3. Options du Slider
Type de Slider:
Ce thème est fournit par défaut avec 3 sliders dynamiques:
Nitrografix Slider
Nivo Slider
3D Piecemaker
Pour régler chacun d’eux, reportez-vous à l’onglet correspondant.
Pour ajouter une nouvelle image, allez dans l’onglet Slider et cliquez sur « Ajouter une image ». Vous pouvez
ensuite régler les options qui vous sont proposées (différentes selon le type de highlight).
Pour changer l’ordre d’affichage de chaque image, restez cliqué sur le numéro à gauche de chaque
image et glissé déposé.
5
4. Custom Widgets
Ce thème est fournit avec 7 widgets personnalisés :
Widget Twitter
Le seul champ requis est le nom d’Utilisateur (correspondant à votre compte Twitter).
Par défaut, le nombre de tweets affichés est de 5.
Widget FlickR
Le seul champ requis est l’ID de votre compte flickR.
Par défaut, le nombre de photos affichées est de 6.
Tips : Vous pouvez utiliser idGettr http://idgettr.com/ pour récupérer votre ID flickR.
Articles Populaires
Les articles populaires sont triés en fonctions du nombre de commentaires postés. Vous pouvez choisir deux
types de rendu :
Mode image
Mode miniature
Par défaut, les 3 articles les plus populaires sont affichés.
Articles récents
Ce widget affiche les articles les plus récents.
Vous pouvez choisir deux types de rendu :
Mode image
Mode miniature
Par défaut, les 5 derniers articles sont affichés.
Commentaires Récents
Ce widget affiche les commentaires les plus récents.
Par défaut, les 3 derniers commentaires sont affichés.
Formulaire de contact
Ce widget propose un formulaire de contact. Le champ requis est votre email.
Réseaux Sociaux
Ce widget affiche vos réseaux sociaux sous forme d’icones. Vous pouvez choisir quels réseaux vous
souhaitez afficher et quelles URLs vous souhaitez afficher.
5. Shortcodes
6
Ce thème est fourni avec une trentaine de shortcodes.
Les champs en vert sont optionnels et ceux en rouge sont obligatoires.
Attention : Ne jamais copier coller un Shortcode dans l’éditeur de Wordpress, il pourrait y insérer des
caractères invisibles.
Utiliser le Plugin Colorwave disponible en cliquant sur le bouton avec le logo Colorwave dans l’éditeur
tinyMce.
ou
Insérer les shortcode à la main.
Vidéos :
[youtube video_id="video_id" width="width" height="height" /]
[vimeo video_id="video_id" width="width" height="height" /]
Video_id correspond à l’ID d’une vidéo.
Exemple : K-2nNoyfn-Y pour Youtube
16660444 pour Vimeo
Messages :
[warning]content[/warning]
[info]content[/info]
[error]content[/error]
[valid]content[/valid]
Listes :
[list
[list
[list
[list
[list
[list
type="check"]list[list]
type="plus"]list[list]
type="warning"]list[list]
type="love"]list[list]
type="star"]list[list]
type="arrow"]list[list]
List doit correspondre à une liste ordonnées (ol) ou non ordonnée (ul).
Onglets / Accordéons :
[tabs]
[tab title="title"]content[tab]
[tab title="title"]content[tab]
[/tabs]
[accordion]
[tab title="title"]content[tab]
[tab title="title"]content[tab]
[/accordion]
Vous pouvez rajouter autant d’onglet que vous souhaitez en rajoutant le nombre de
[tab title="title"]content[tab] que vous souhaitez.
Slideshow :
[slideshow width="slideshow_width" height="slideshow_height"]
7
[img title="your_title" link="your_link" image="your image" /]
[img title="your_title" link="your_link" image="your image" /]
[/slideshow]
Vous pouvez rajouter autant d’image que vous souhaitez en rajoutant le nombre de
[img title="your_title" link="your_link" image="your image" /] que vous souhaitez.
Images :
[frame_left]image[/frame_left]
[frame_right]image[/frame_right]
[frame]image[/frame]
Formulaire de contact :
[contactform email="your email" /]
Boutons :
[button link="your link"]content[/button]
[buttonwhite link="your link"]content[/buttonwhite]
Dropcap :
[dropcap]content[/dropcap]
Dropcap correspond à un paragraphe avec la première lettre en majuscule.
Zones :
½½
[one_half]your content[/one_half]
[one_half_last]your content[/one_half_last]
1
3
1
3
1
3
[one_third_first]your content[/one_third_first]
[one_third]your content[/one_third]
[one_third_last]your content[/one_third_last]
1
4
1
4
1
4
1
4
[one_fourth_first]your content[/one_fourth_first]
[one_fourth]your content[/one_fourth]
[one_fourth]your content[/one_fourth]
[one_fourth_last]your content[/one_fourth_last]
2
3
1
3
[two_third]your content[/two_third]
[one_third_last]your content[/one_third_last]
1
3
2
3
[one_third_first]your content[/one_third_first]
[two_third_last]your content[/two_third_last]
3
4
1
4
[three_fourth]your content[/three_fourth]
[one_fourth_last]your content[/one_fourth_last]
8
1
4
3
4
[one_fourth_first]your content[/one_fourth_first]
[three_fourth_last]your content[/three_fourth_last]
Separateurs horizontals :
[separ /]
[separate /] Attention : Faite attention avec l’utilisation de ce separateur, il sépare le site entièrement de
gauche à droite, vous risquez de casser votre site si il n’est pas placer au bon endroit. (html error)
Services récents :
[services limit="3" limit_per_row="3" /]
Articles récents :
[posts title="title" subtitle="subtitle" limit="2" /]
Derniers projets :
[works title="title" subtitle="subtitle" linkprojects="link" /]
linkprojects correspond au lien de votre page portfolio.
Dernier projet :
[last_work title="title" subtitle="subtitle" /]
Membre d’équipes :
[people name="name" subtitle="subtitle" twitter="username" avatar="link" /]
twitter correspond au nom d’utilisateur de votre compte Twitter.
Link correspond au lien de l’image préalablement uploadé sur votre serveur. Dimension : 101 x 101px
6. Articles
Pour rajouter des images au dessus de chaque article il suffit de « mettre une image à la une ». L’image
utilisée aura une taille de 485 x 188px.
7. Pages
Vous pouvez personnaliser le texte par défaut (le titre de la page) situé sous le menu. Pour changer le titre,
remplissez le champ Titre et pour rajouter une description remplissez le champ Description – tous deux situés
dans l’onglet Options Générales de la page.
9
Tip : Vous pouvez également désactiver le haut de page en cochant la case « Désactiver le haut de
page ».
Ce thème est fournit avec cinq modèles de page :
1. Une colonne, pas de Sidebar
En sélectionnant ce modèle, le contenu de la page sélectionnée prendra tout l’espace en largeur de la
page et désactivera la Sidebar principale (à droite par défaut).
2. Portfolio
Ce modèle correspond à un portfolio.
Les images de ce portfolio correspondent aux images à la Une de chaque Work.
 Reportez vous à la catégorie 9. Portfolio
Tip : La sidebar principale est désactivée dans ce modèle.
3. Service
Ce modèle correspond aux services.
Les images correspondent à l’option Image de chaque Service.
 Reportez vous à la catégorie 10. Service
Tip : La sidebar principale est désactivée dans ce modèle.
4. Galerie
Ce modèle correspond aux galeries.
Les images correspondent aux images à la Une de chaque galerie.
 Reportez vous à la catégorie 8. Galerie
Tip : La sidebar principale est désactivée dans ce modèle.
5. Plan du site
Ce modèle affichera un plan du site après le contenu de la page sélectionnée. (la sidebar principale reste
affichée).
8. Galerie
Pour rajouter une image à chaque portfolio, insérer une « image à la Une ».
Pour rajouter une description de l’image dans le pop-up, vous devez ajouter du contenu à chaque galerie.
Le seul Tag autorisé est le saut de ligne (<br />).
9. Portfolio
10
Pour chaque portfolio, vous pouvez ajouter des catégories et des clients – onglets Catégories et Clients.
Pour rajouter une image à chaque portfolio, insérer une « image à la Une ». Dimension : 480 x 220px
Vous pouvez ajouter des images de preview dans les champs Image Preview 1,2… Ces images seront
affichées dans un Slideshow avec l’image à la Une.
10. Service
Entrez l’URL complète de l’image du service que vous avez préalablement uploadé sur votre serveur dans
le champ « Image Service ». Dimension : 290 x 130px
Le champ « Exemple URL » sert à rajouter un bouton Exemple situé sous l’image de chaque service.
Le champ « Voir Plus - Page » sert à rajouter un bouton Voir Plus situé sous l’image de chaque service et
correspondant à une page du site.
Vous pouvez trier vos services en spécifiant un chiffre dans le champ Ordre – onglet Attributs.
11. Ressources externes



Nivo Slider v2.1: http://nivo.dev7studios.com/
Piecemaker 3D: http://www.modularweb.net/piecemaker/
Cufon Font Replacement: http://cufon.shoqolate.com/generate/

Replacement Font:
 Colaborate http://www.fontsquirrel.com/fonts/Colaborate
 Catarell http://www.fontsquirrel.com/fonts/Cantarell
 Perspective Sans http://www.fontsquirrel.com/fonts/Perspective-Sans
 Sansation http://www.fontsquirrel.com/fonts/Sansation




Plugin Wordpress Sidebar Generator: http://wordpress.org/extend/plugins/sidebar-generator/
TimThumb : http://www.binarymoon.co.uk/projects/timthumb/
jQuery Easing : http://gsgd.co.uk/sandbox/jquery/easing/
Pretty Photo: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-

clone/
F0101 Social IconSet : http://www.woothemes.com/2009/11/simple-bold-social-mediaicons/
12. Résumé
Toutes les images sont redimensionnées automatiquement et coupées si besoin. Ce thème utilise la gestion
des images de Wordpress 3 et TimThumb pour le redimensionnement.
Vous pouvez régénérer vos images miniatures avec l’utilisation du plugin « Regenerate Thumbnails » de
Viper007Bond. http://wordpress.org/extend/plugins/regenerate-thumbnails/
Attention : Timthumb est configuré pour supporter uniquement le nom de domaine où est installé le thème.
Veuillez utiliser ce nom de domaine pour vos images.
11