Epoustouflant, voila le mot qui pourrait définir à merveille le kit graphique Dark Corporate, ce kit graphique dépasse les fonctions simples de la traditionnelle charte graphique puisque nous vous proposons aujourd’hui un site clé en main composé de 6 pages en HTML (exploitables en l’état) avec des fonctions comme menu CSS dynamique, avec onglet de survol et de situation, page de contact et d’envois d’emails (en PHP), une page liens et partenaires avec affichage des captures dynamiques avec le script lightbox, galerie de photos par effet glissant et reflet web2.0, un moteur de recherche Google … Mais surtout nous vous proposons un logo créé rien que pour vous, exploitable simplement, nous fournissons même les fichiers sources Photoshop et un tutorial pour le personnaliser.
Pas la peine d’être un as de l’informatique, ni même d’avoir de grandes connaissances en programmation pour adapter ce kit graphique. De plus une assistance vous est proposée : pour les débutants nous proposons via le site wks.fr plusieurs tutoriaux pour vous aider à personnaliser les kits graphiques achetés dans notre galerie. Voyez par vous-même sur cette page : http://www.wks.fr/
Votre site ne mérite-t-il pas d’être le plus beau ? Habillez votre site avec DarkCorporate c’est acquérir un aspect professionnel, intuitif et tendance. N’oubliez pas que c’est via l’aspect graphique de votre site que vos internautes jugeront votre sérieux.
Description des fonctionnalités communes à chaque page
Un header contenant un logo à gauche (vous pourrez le personnaliser facilement car nous vous proposons les sources photoshop ainsi qu’un guide) et un moteur de recherche Google à droite (intégré parfaitement à le charte).
Dessous, nous avons un menu horizontal entièrement codé sous forme de liste CSS ; au survol de la souris les onglets changent de couleur et sur chaque page l’onglet actif devient blanc pour aider l’internaute à naviguer sur le site internet.
Ensuite nous avons sur la partie gauche un menu vertical textuel avec son header (effet de survol sur les liens) et enfin dessous trois blocs graphiques (changeant de couleur au passage de la souris) pour y placer trois liens importants.
Pour le contenu le bloc seulement est présent sur chaque page et il est composé d’un titre graphique (la source Photoshop de ce titre se trouve dans le dossier).
Et en fin de page nous avons le bloc « footer ».
Description des fonctionnalités page par page
Page 1 : index.html
Cette page correspond à la page d’accueil du site, elle comprend deux espaces de contenus spécifiques : un premier sur fond noir pour afficher les titres des news par exemple (sur deux blocs étirables verticalement) et un bloc blanc pour y placer l’édito par exemple.
Page 2 : page2.html
Cette page est une page de contenus types, elle comprend les fonctionnalités complètes du site mais en intégrant à droite un bloc pour les contenus textes (long).
Page 3 : page3.html
Cette page correspond à la galerie, elle s’affiche sous forme de plusieurs vignettes qui se suivent et s’affichent avec un effet glissant. Très facile d’utilisation, vous pourrez y placer autant d’images que vous le souhaiterez !
Page 4 : page4.html
Cette page est une page de contenus types, elle comprend les fonctionnalités complètes du site mais en intégrant à droite un bloc pour les contenus textes (long).
Page 5 : page5.html
Cette page liste vos futurs liens et partenaires, vous affichez un titre (nom du site) une description, une capture d’écran ; en cliquant sur celle-ci, la capture s’ouvre dynamiquement en grand avec une animation.
Page 6 : page6.html
Cette page contient un formulaire, vos internautes rempliront le formulaire et une fois validé vous recevrez un email contenant toutes les informations saisies.
Programmation de l’interface MyFolio
Full CSS
Toute l’interface est codé en strict XHTML CSS
Les menus sont sous forme de listes facilement paramétrables
Les styles de textes et de mises en page sont placés sur une feuille css externe
Galerie effet glissant + miroir (type Apple)
Galerie CSS + PHP présentant plusieurs photos sous forme de vignettes, celles-ci glissent et se présentent avec un reflet à la web 2.0 ! Cette galerie est tout simplement délicieuse : vous pouvez voir un exemple sur http://www.wks.fr/
Affiche des images en lightbox
Image dynamique placer vos vignettes dans une balise div spécial et vos images s’ouvriront en grand grâce à une animation surprenante. Voir un exemple sur cette page : http://www.wks.fr/
Un formulaire de contact
Géré en JavaScript pour sécuriser le formulaire et en PHP pour traiter l’envoi du mail vers votre boite email. Ce script et paramétrable en deux minutes.
Un formulaire de recherche
Le moteur de recherche Google dans votre kit graphique ! Vos futurs internautes auront la possibilité de lancer une recherche Google directement à partir de vos pages. Vous n’avez rien à programmer, le moteur de recherche est déjà fonctionnel !
Information complémentaire sur le design :
Un header avec un logo original pour votre futur site Internet (header vierge disponible + fichier PSD du logo)
Un menu horizontal avec effet de Rollover + bouton onglet pour faciliter la navigation sur le site, chaque page a sa propre couleur !
Présence d’images vierges : logo, header, bouton
Présence du fichier PSD de l’interface complète pour vous aidez à modifier en profondeur votre prochain site
Autres liens sur Internet en rapport avec l’interface graphique DarkCorporate
Article de présentation de l’interface DarkCorporate
http://www.wks.fr/Kit-graphique-DarkCorporate.html
Tutorial de personnalisation du kit DarkCorporate
http://www.wks.fr/Dark-Corporate-Aide-a-la.html
Tutorial de création du logo :
http://www.wks.fr/Creer-une-bille-metal-dark-glossy.html
Exemple du script lightbox :
http://www.wks.fr/kitgrafik/light1/index.html
Exemple de la galerie glissante :
http://www.wks.fr/kitgrafik/light2/index.html
Site officiel du script lightview :
http://www.nickstakenburg.com/projects/lightview/
Attention : les scripts ne sont pas à vendre, ils sont disponibles gratuitement sur le net, ils sont intégrés dans cette charte à titre d’exemple. L’utilisation, la diffusion sont entièrement gratuits via les sites des auteurs.
-
Kit graphique : Dark Corporate
11 mars 2008 21:50, par chantal
Merci pour ce tutorial il permet de bien comprendre comment modifier les images.
je cherhce deseperement comment modifier l’image : block_white_background (index) car je ne la retrouve pas en psd
merci pour votre aide
chantal
ps : le design est superbe
Répondre à ce message
-
Kit graphique : Dark Corporate
14 mars 2008 14:07
BONJOUR,
dans la galerie les miniature avec reflet ne s’affiche pas en local est ce normal ???
Répondre à ce message
-
Kit graphique : Dark Corporate
19 mars 2008 11:51, par clement
bonjour a tous,
question bete surement :
il est ecrit dans le tuto :> Modifier le menu horizontal à onglet> Ce menu est présent dans chaque fichier html, vous devrez donc faire la> modification sur chaque fichier : j’ouvre le fichier index.html (pour> faire la modification sur la page d’index) et je fais ctrl + f (pour> ouvrir une recherche interne) et j’inscris dans le formulaire menu_first,> j’appuie sur entrer. Je me retrouve directement à l’endroit où se trouve> le menu. Je n’ai plus qu’à modifier le nom des onglets>>
dans quel application ouvrir la page html ?
si je le fait dans internet explorer ou dans dreamw, controle+f + la manip....rien ne se passe....je nai pas possibilité de changer le nom de l’onglet...
autre question : est ce possible de changer le fond noir de toute les pages par un fond perso ?
merci d’avance pour vos conseils
clement.
Répondre à ce message
-
Kit graphique : Dark Corporate
20 mars 2008 12:48
salut !
je souhaite rajouter un onglet en haut,
g réussit avec dreamw mais il me coupe le bloc ’menu last’ il me le met + bas...fo t’il que je reduise chaque onglet dans photoshop en largeur ainsi que les blocs ’menu’ ?
merci d’avance et merci aussi de votre disponibilité c’est super sympa
Répondre à ce message
-
Kit graphique : Dark Corporate
25 mars 2008 13:59, par alexandra
Bonjour,
je fais mon site en plusieurs langues, il me faut donc créer d’autres images content_1_back_xxx
qui aparemment correspondent dans le code a content_haut_1_xxx
les xxx sont interchangeables, mais quand je crée une new image et que je la nomme ainsi et fais cette procedure, ça ne marche pas !!!
je travaille avec dream et ne sais pas du tout manipuler le code.
Sinon le moteur google ne fonctionne pas
et je ne sais pas comment faire pour que les messages du formulaire de contact arrivent sur mon email.
Pour l’instant ça me fait erreur quand j’essaie d’envoyer.
Help
Répondre à ce message
-
Kit graphique : Dark Corporate
28 mars 2008 13:46
SALUT
bon toujours pas de reponse finalement !
pour mes onglet je veut en rajouter un :
quand je change la largeur dans les codes css ca marche pas, soit la barre d’onglets est pas assez large, soit elle est bien mais le dernier onglet se barre en dessous...help please !!!
Répondre à ce message
-
Prb de version des icone_left.psd !
31 mars 2008 22:16, par patrick
j’ouvre le fichier icone_left1.psd dans photoshop. Je ne modifie rien, je laisse tel quel. Je sauvegarde en .png, et la page html une fois publiée fait apparaitre une ligne bleue à la base du bouton (non-survolé). Cette barre correspond la à la 1ere ligne du bouton bleu (survolé) dans le psd. Il y a un décalage et je pense qu’il y a un prb de version des fichiers psd pour ces icone_left. Merci de vérifier et de proposer une mise à jour.
Répondre à ce message
-
Boutons Icone_left ne fonctionne pas sous IE
31 mars 2008 22:23, par Patrick
Les roll-overs des boutons Icone_left ne fonctionne pas sous IE.
Répondre à ce message
-
Kit graphique : Dark Corporate
7 avril 2008 17:28
Bonjour quand j’ouvre le Kit graphique Dark Corporate dans dreamw tout ce mélange je n’arrive plus a me retrouvé pourriez-vous me dire comment dois-je faire pour avoir l’index en entier merci.
Répondre à ce message
-
Kit graphique : Dark Corporate
3 mai 2008 16:18
Lightview is not free, it should not be inside the download. A link to the officla site can be provided instead so people can conform to the license.
Voir en ligne : Lightview - License
Répondre à ce message
-
Kit graphique : Dark Corporate
3 août 2008 08:22, par mazflo007
Bonjour, j’aimerais savoir si il est possible de modifier la taille (d’affichage) des images pour la galerie glissante.
Merci
Répondre à ce message
-
Kit graphique : Dark Corporate
2 octobre 2008 21:27, par flo
Bonjour,
ou peut on trouver le tutorial pour la modification du formulaire php du kit dark corporate ?
Répondre à ce message
-
Kit graphique : Dark Corporate
18 octobre 2008 12:47, par Eldiablo
Bonjour, jaimerais savoir quelle police d’ecriture vous utilisez afin de modifier les tous les boutons !
Merci !
Répondre à ce message
-
Kit graphique : Dark Corporate
16 février 2009 18:48
bonjour , j aimerais savoir comment parametrer l’envoi de mail a la page 6 , ou faut il rentrer mon adresse mail ou tout autre renseignement ? je seche
Répondre à ce message
-
Kit graphique : Dark Corporate
23 février 2009 16:45
mais a quel endroit , je suis désole , je ne parvient pas a trouver ...
Répondre à ce message
-
Kit graphique : Dark Corporate
28 février 2009 22:40
Bonjour,
je suis super content du kit graph merci pour ce superbe travail.
par contre j’ai quelques soucis que j’aimerai éclaircir avec votre aide
pouvez vous m’expliquer comment enlever le texte dans les différents onglets et page je m’explique tout en haut du kit il y a un logo,juste à coté j’ai dark......
comment faire pour enlever tout ça et garder que l’image (le fond) même chose pour les autres onglets et barre de menu (je bosse avec dreamweaver et photoshop cs4)
merci d’avance
j’attends votre réponse
Répondre à ce message
-
Kit graphique : Formulaire
6 avril 2009 11:17
Voila pour ceux qui utilise le formulaire et que le nom, prenom et l’email marché pas quand vous receviez le message ecriver cette ligne a from
$headers .= « From : $nom $prenom <$email>\n »
Voila
Répondre à ce message
-
Kit graphique : Dark Corporate
23 mai 2009 20:08, par diabolo57
magnifique ce kit grapfik..mais ’jai un prob avec l’envoi de mail.
J’ai changé les adresses dans le ficher traitement_email.php, ensuite
j’ai demandé un ami d’essayer l’envoi ...voilà le message d’erreur affiché
Warning : mail() has been disabled for security reasons in /var/www/d/do/dom/domo.informatique.perso.neuf.fr/public_html/traiteme nt_email.php on line 13
Un probleme est survenu lors de l’envoir de votre message !
ou est le prob ??
merci de votre aide
Répondre à ce message
-
Kit graphique : Dark Corporate
8 septembre 2009 13:58, par arcoa
bonjour,je viens de telecharcher le kit dark,tout fonctionne sauf l’affichage des photos merci de m’aider
Répondre à ce message
-
Kit graphique : Dark Corporate
25 septembre 2009 12:01, par Psill
Bonjour, très beau travail !!! Tout fonctionne impecable. Ma question porte sur la galerie, comment ouvrir l’url des images dans une nouvelle page ? Merci.
Répondre à ce message
-
Kit graphique : Dark Corporate
3 octobre 2009 11:30, par Le Lantien
Bonjour.
Je viens d’acheter ce magnifique kit graphique, je voudrais le recoder coté HTML mais je ne trouve pas le psd de l’interface, il n’y est dans aucun dossier ...
Répondre à ce message
-
Kit graphique : Dark Corporate
7 octobre 2009 20:03, par Le Lantien
Bonsoir.
Je vais m’expliquer alors :
le design n’est pas super bien codé selon mes envies. Je veux dire par là qu’il ne passe pas bien en 800 (je pense aussi à ceux qui n’ont pas les nouveaux écrans).
PS : lors de l’achat je peux lire : « Présence du fichier PSD de l’interface complète pour vous aidez à modifier en profondeur votre prochain site. »
Je voudrais bien l’avoir donc. J’invite le responsable du kit à me contacter par email pour que je puisse lui montrer la licence d’achat afin qu’il puisse me le fournir.
Répondre à ce message
-
Kit graphique : Dark Corporate
8 octobre 2009 08:12, par Le Lantien
Merci, je vous ai envoyé un message.
Répondre à ce message
-
Kit graphique : Dark Corporate
10 octobre 2009 19:03, par Le Lantien
Toujours aucune réponse ...
Répondre à ce message
-
Kit graphique : Dark Corporate
15 octobre 2009 17:24, par Le Lantien
Je vous ai à nouveau envoyé un message email ... J’espère que maintenant vous allez y répondre car je commence à m’impatienter ...
Répondre à ce message
-
Kit graphique : Dark Corporate
9 janvier 01:28, par Luffy
Bonsoir l’envoi de mail ne marche pas voici le code
<font color="#000000">
<font color="#0000BB"><?
<br />$headers </font><font color="#007700">= </font><font color="#DD0000">"MIME-Version: 1.0\n"</font><font color="#007700">;
<br /></font><font color="#0000BB">$headers </font><font color="#007700">.= </font><font color="#DD0000">"Content-type: text/html; charset=iso-8859-1\n"</font><font color="#007700">;
<br />
<br /></font><font color="#0000BB">$headers </font><font color="#007700">.= </font><font color="#DD0000">"From: BleuNeutral <creatweb-support@hotmail.fr>\n"</font><font color="#007700">;
<br />
<br /></font><font color="#0000BB">$headers </font><font color="#007700">.= </font><font color="#DD0000">"Cc: $adresse\n"</font><font color="#007700">;
<br /></font><font color="#0000BB">$headers </font><font color="#007700">.= </font><font color="#DD0000">"Bcc: creatweb-support@hotmail.fr\n"</font><font color="#007700">;
<br />
<br /></font><font color="#0000BB">$message </font><font color="#007700">= </font><font color="#0000BB">htmlentities</font><font color="#007700">(</font><font color="#DD0000">"$texte"</font><font color="#007700">);
<br />
<br /></font><font color="#FF8000">// On envoi l'email
<br /></font><font color="#007700">if ( </font><font color="#0000BB">mail</font><font color="#007700">(</font><font color="#0000BB">$destinataire</font><font color="#007700">, </font><font color="#0000BB">$sujet</font><font color="#007700">, </font><font color="#0000BB">$message</font><font color="#007700">, </font><font color="#0000BB">$headers</font><font color="#007700">) ) echo </font><font color="#DD0000">"<br/><br/><center><h2>Nous avons bien reçu votre message, merci.</h2></center>"</font><font color="#007700">;
<br />else echo </font><font color="#DD0000">"Un probleme est survenu lors de l'envoir de votre message !"</font><font color="#007700">;
<br />
<br /></font><font color="#0000BB">?></font>
</font>
Répondre à ce message
-
可愛い 女子
15 janvier 13:42, par 可愛い 女子
|
C’est un vrai problème. Par contre sous IE 7 il y a aucun soucis !
