22/10/2011

Dessinez et gagnez votre skin perso !

Se créer une skin perso commence par un dessin……on se prépare son fond de blog tel qu’on voudrait qu’il soit !
J’ai envie de vous faire travailler !.........et voir si vous savez exactement ce que vous voulez ! : -))
Alors pour vous donner la marche à suivre……voici mon tout premier travail lorsque j’ai réalisé la skin « Pictures »…..tout commence dans un éditeur d’images…..n’importe lequel….payant si vous avez de l’argent à gaspiller…..ou gratuit si vous avez autre chose à faire de vos sous ! : -)))
Donc…..voici le départ de ma skin Pictures.

photo2.JPG

Vous voyez que sur un fond qui fait 1024px……j’ai « dessiné la page telle que je souhaitais qu’elle soit…….
Vous pouvez aussi choisir une largeur jusque 1280px…..seulement…il faut savoir que beaucoup d’internautes surfent encore avec des résolution de 1024px….ce qui se traduit pour eux par l’obligation d’utiliser la barre de navigation horizontale pour visionner l’entièreté de votre blog si vous dépassez 1024 de largeur.

Vous devez au préalable choisir si vous voulez une colonne, droite ou gauche ou deux colonnes…..
Perso….pour ceux qui veulent placer des images, je conseille une seule colonne…..ça laisse la place à des images plus grandes..
Pour composer votre fond, il vous faut tenir compte du fait que, pour être placée dans votre CSS, cette image sera découpée en trois partie, comme ci-dessous

photo2découpe.jpg

Après découpe, il y aura donc trois images à placer dans votre CSS pour que cela corresponde au fond de votre blog.
Banner, placé en entête, Middle, sera la petite partie qui sera répétée autant de fois qu’il le faudrat pour joindre la bannière..... au bas de votre blog qui sera constitué par le « Bottom »
Vous pouvez donc décorer la bannière et le bottom comme vous le souhaitez, mais il est important de laisser le « middle » le plus simple possible et sans décoration autre que « Verticale »
Voilà…..pour ceux qui voudraient avoir une skin perso……je leur propose de se mettre dès maintenant à la composition de leur fond…….une fois que vous pensez avoir réalisé la bonne image, laissez un lien en commentaire menant à cette image, je vous dirai alors si elle est adaptable à la CSS….et si non….je vous indiquerai le « pourquoi »……à vous alors  de corriger cette image.
A l’issue de cela…….disons le 10 Novembre, les images adaptables seront proposées au vote des blogueurs, et les deux gagnants auront droit à leur skin perso réalisée à partir de leur image…….
Alors………Courage….et….à vos éditeurs d’images ! : -)))))


 

Coucou Nays : -)))Ton script fonctionne bien.....seulement faut le poster sans l'éditeur TinyMCE! :-))))))

 

20:53 Écrit par Jules dans Designs skynetblogs | Lien permanent | Commentaires (126) | |  Facebook

28/09/2011

Skin "Pictures": Nouveau design

Voici un nouveau design pour skynetblogs….le design « Pictures»
Comme son nom l'indique....il est réalisé pour mettre les photos en valeur.
Ce design « Plug and play », est un design statique d'une largeur totale de 1024px, il est prêt à l’emploi.

  
Skin Pictures

Cliquez pour agrandir

 

skin pictures.JPG

 

Tester ce design en situation réelle chez Co ou....sur mon vieux blog photo

Feuille CSS de ce design : ICI
Comment mettre ce design en place sur votre blog, lire les explications ICI concernant l'installation de la CSS, ne pas oublier de choisir d'abord un design avec une colonne droite.

Remarques importantes concernant ce design:

C'est un design ne permettant qu'une largeur de photos et videos de maximum 780px.
Vous pouvez proposer des photos plus larges mais avec affichage dans une "Pop-up".

 

07/07/2011

Skin Rainbow: Nouveau design skynetblogs

 

Bon…..il est temps de revenir à des choses sérieuses ! : -))))

 

Un peu d’air nous fera du bien……et j’espère que José usera de toute sa verve pour nous donner son avis sur ce poste ! : -))))

 

Voici donc un nouveau design pour skynetblogs….le design « Rainbow »

 

Ce design « Plug and play », est un design statique d'une largeur totale de 1024px, il est prêt à l’emploi.

 

 
Skin Rainbow

Cliquez pour agrandir

skin rainbow.JPG

 

Feuille CSS de ce design : ICI
Comment mettre ce design en place sur votre blog, lire les explications ICI concernant l'installation de la CSS, ne pas oublier de choisir d'abord un design avec une colonne droite.

Remarques importantes concernant ce design:

C'est un design ne permettant qu'une largeur de photos et videos de maximum 600px.
Vous pouvez proposer des photos plus larges mais avec affichage dans une "Pop-up".

 

27/01/2011

Skin Iphone: nouveau design skynetblogs

Comme beaucoup le savent……Item nous a quitté ! : -))))
Alors……” In memoriam of Item “.....Voici le design “Iphone”.....:-)))
Ce design est issu de la collaboration d’Item et Jules......un vrai travail d’équipe : -))))
Jules dans le rôle du CSS général……..et Item dans le rôle du CSS-HTML de l’aspect « Iphone » des commentaires…..voir à la fin du poste.
Ce design vous est présenté avec trois couleurs de fond différents…..à vous de faire votre choix parmis les différentes CSS proposées…….
Ce design « Plug and play », est un design statique d'une largeur totale de 1001px, il est prêt à l’emploi.

 
Iphone Anthracite

Cliquez pour agrandir

Iphone anthracite.JPG


Feuille CSS de ce design : ICI
Comment mettre ce design en place sur votre blog, lire les explications ICI concernant l'installation de la CSS, ne pas oublier de choisir d'abord un design avec deux colonnes.
 

Iphone Blue

Cliquez pour agrandir 

iphone bleu.jpg

Feuille CSS de ce design : ICI
Comment mettre ce design en place sur votre blog, lire les explications ICI concernant l'installation de la CSS, ne pas oublier de choisir d'abord un design avec deux colonnes.

 

Iphone White

Cliquez pour agrandir

iphone blanc.jpg

Feuille CSS de ce design : ICI
Comment mettre ce design en place sur votre blog, lire les explications ICI concernant l'installation de la CSS, ne pas oublier de choisir d'abord un design avec deux colonnes.

Rendu "Iphone" de la zone commentaires.

Venons en maintenant à Item! :-)))
Pour rendre la zone commentaire plus "Iphone".......outre la CSS, il vous faudrat aussi changer le template HTML " Modèle de la page lien permanent"
Mais voici l'effet que cela devra rendre en zone commentaires.

 

commentaires.jpg


Pour ce faire, rendez vous dans votre administration

Présentation --> Configuration avancée --> Modèle de la page lien permament.

Vous ouvrez le template, et remplacez tout le code s'y trouvant par celui-ci.

Remarques importantes concernant ce design:

C'est un design ne permettant qu'une largeur de photos et videos de maximum 490px.
Vous pouvez proposer des photos plus larges mais avec affichage dans une "Pop-up".

 

18/10/2010

Nouveau design: Zubrowka

Chose promise....chose due....:-)))))  Un design dédicacé à Item, à la gloire des Polonaises.......:-))))....Là au moins, plus il ajoutera de modules dans la colonne, plus ses verres se rempliront! :-)))))))))))
Ce design « Plug and play », est un design statique d'une largeur totale de 1006px, il est prêt à l’emploi.

 
Zubrowka

Cliquez pour agrandir

Design Zubrowka.jpg


Feuille CSS de ce design : ICI
Comment mettre ce design en place sur votre blog, lire les explications ICI concernant l'installation de la CSS, ne pas oublier de choisir d'abord un design avec une seule colonne à droite.
 

Outre cela, il vous faudra aussi modifier la page "Anti-spam"

Pour ce faire, rendez vous dans votre "Administration"---> "Présentation"--> "Configuration avancée"
Là ouvrez le template "Anti spam"
Une fois ouvert, remplacez ce code:

{include file="dbblog:header"}

Par celui-ci:

<div style="background-image: url(http://static.skynetblogs.be/media/164139/1835461234.jpg); background-repeat: repeat; width: 1280px; height: 1024px;">


C'est une image de fond pour cette page, vous pouvez la changer en changeant simplement l'adresse.

Remarques importantes concernant ce design:

C'est un design ne permettant qu'une largeur de photos et videos de maximum 590px.
Vous pouvez proposer des photos plus larges mais avec affichage dans une "Pop-up".

12/10/2010

Nouveau design: Aztec

Voici un nouveau design « Plug and play », c'est un design statique d'une largeur totale de 1006px, il est prêts à l’emploi.

 
Aztec

Cliquez pour agrandir

Design Aztec.jpg


Feuille CSS de ce design : ICI
Comment mettre ce design en place sur votre blog, lire les explications ICI concernant l'installation de la CSS.
 

Outre cela, il vous faudra aussi modifier la page "Anti-spam"

Pour ce faire, rendez vous dans votre "Administration"---> "Présentation"--> "Configuration avancée"
Là ouvrez le template "Anti spam"
Une fois ouvert, remplacez ce code:

{include file="dbblog:header"}

Par celui-ci:

<div style="background-image: url(http://static.skynetblogs.be/media/164139/1835461234.jpg); background-repeat: repeat; width: 1280px; height: 1024px;">


C'est une image de fond pour cette page, vous pouvez la changer en changeant simplement l'adresse.

Remarques importantes concernant ce design:

C'est un design ne permettant qu'une largeur de photos et videos de maximum 500px.
Vous pouvez proposer des photos plus larges mais avec affichage dans une "Pop-up".

 

31/07/2010

Nouveaux designs : Theatral dark et Theatral dark « Toxic »

En fait ces deux designs sont directement déclinés à partir du design « Theatral », proposé ICI sur « Rien »
Comme le design de base (Theatral)…ces deux designs sont « Plug and play », dynamiques, et prêts à l’emploi.
Ils sont assez similaires….seule la bannière change un peu…..

Theatral Dark


Cliquez pour agrandir

Dark.jpg

Feuille CSS de ce design : ICI

 

Theatral Dark « Toxic »


Cliquez pour agrandir

Dark toxic.jpg


Feuille CSS de ce design : ICI

Comment mettre ces designs en place sur votre blog, lire les explications ICI