Enfin, l'aide de l'informatique est ici

Blog de solutions informatiques.

Améliorer les performances d'un site web (boutons sociaux)

Publié par Xaus Xavier Nadal 17th sur Mars 2013

Aujourd'hui, nous vous montrons comment améliorer les performances d'un site web en faisant les boutons sociaux facebook, twitter et Google Plus sont chargés sur le web, mais seulement quand on passe la souris sur.

Comme tout le monde saura que je suis passionné par l'amélioration des performances Web et vous pouvez voir des exemples dans ce blog.

Nous avons obtenu de très bons résultats, même lors du chargement sur un partagé sans hébergement VPS par manque de pâte.

Un des derniers développements qui ont mis en œuvre a été la charge de sandwichs réseaux sociaux ennuyeux pour obtenir une partie de la partition dans les pages de test de performance que http://www.webpagetest.orgou http://www.gtmetrix.com Ils ont fait le web se charge plus lente provoquant une diminution de positionnement google entre autres moteurs de recherche.

Pour contourner ce problème, je vais vous montrer quelques exemples en direct afin qu'il puisse adapter à l'un de vos sites Web.

  • Le site perçoit une 55% plus rapide.
  • WordPress -> Vous pouvez voir le résultat dans ce blog http://www.megacrack.es.
  • Prestashop -> Vous pouvez voir le résultat dans http://www.venlotodo.com (Site Web vendant toutes sortes de produits, y compris sexshop avec des prix impressionnants (envoyer un courriel à ventas@venlotodo.com et dire que vous venez et vous ferez un MegaCracks rabais d'assurance.) Le malheur est que seulement vendre en Espagne, et aussi si vous êtes dans la province de Barcelone parler avec eux et le prix encore mieux).

Pour que vous puissiez voir le changement que vous pouvez utiliser le lien suivant comparant la vitesse de chargement entre les sites 2 http://whichloadsfaster.com/.

Je me considère comme tout à fait incapable de programmation, mais je suis très habile dans l'art de la logique et de comprendre comment les choses fonctionnent et surtout j'aime ce que je fais et investir le temps qu'il faut. (Je dis cela parce que je suis sûr que le code source peut être grandement améliorée avec vos commentaires et si vous pouvez faire les avantages de la communauté, il vous remercie de ce blog voir vos suggestions d'amélioration).

Pour mettre en œuvre sur tout Web avec HTML

Ensuite, le code source de la bande que j'enseigne (HTML), Ce que nous faisons est d'avoir plusieurs images des mêmes boutons que nous avons sur facebook, twitter et Google plus et si vous survolez l'aide d'un appel de fonction javascript qui a déclenché le script de chacun des éléments sociaux.

<html>
<corps>

<div classe="G-plusone" les données de taille="Medium" données href="Http://www.megacrack.es" onMouseOver="Activate_gp ()">
<IMG SRC="../files/gplus.png" largeur=35 la taille=23>
</div>
<div>
<a href="Https://twitter.com/megacracks" classe="Twitter-suivi-bouton"
 données-show-count="True" Show-screen-nom de données="Faux" données-lang="Il est" onMouseOver="Activate_tw ()">
<IMG SRC="../files/seguir.png" largeur=62 la taille=22></A></div>
<div classe="Fb-like" données href="Http://www.megacrack.es" données send="Faux" agencement des données="Button_count"
 les données de largeur="100" données-show-faces="Faux" onMouseOver="Activate_fa ()" >
<div classe="Fb-like" données href="Http://www.megacrack.es" données send="Faux" agencement des données="Button_count"
 les données de largeur="100" données-show-faces="Faux" onMouseOver="Activate_fa ()" ></div>
<IMG SRC="../files/megusta.png" largeur=74 la taille=24></div>

<scénario type="Text / javascript">

	<! - <JavaScript SD pour Facebook Like Button /> ->
	fonction activate_fa () {(fonction(D, s, id) {
		  var js, fjs = d.getElementsByTagName (s) [0];
		  if (D.getElementById (id)) retour; js = d.createElement (s); js.id = id; js.src = "//connect.facebook.net/es_LA/all.js#xfbml=1"; fjs.parentNode.insertBefore (js, FJS); } (Document, 'Script',  'Facebook-jssdk')); } <! - <JavaScript SD pour Comme Bouton Google Plus /> ->
	fonction activate_gp () {fenêtre .___ gcfg = {lang: 'es'}; (fonction() {
			var po = document.createElement ('Script'); Po.type = 'Text / javascript'; Po.async = vrai; po.src = 'Https://apis.google.com/js/plusone.js';
			
			var s = document.getElementsByTagName ('Script') [0]; s.parentNode.insertBefore (po, s); }) (); } <! - <JavaScript SD pour Twitter Bouton /> ->	
	fonction activate_tw () {!fonction (D, s, id) {
			var js, fjs = d.getElementsByTagName (s) [0];if= {Js d.createElement (s) (D.getElementById (id)!); Js.id = id; js.src ="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore (js, FJS); }} (Document,"Script","Twitter-WJS"); }
</scénario>

</corps>
</html>

Pour mettre en œuvre dans Wordpress

de tout ce que vous aurez à télécharger vos fichiers d'image d'abord sont optimisés avec une telle RIOT (programme impressionnant de compression d'images) d'être aussi efficace que possible à vos fichiers wordpress dans le dossier par exemple. A la fin de l'article, je vous laisse le lien vers les fichiers png afin de ne pas être de les télécharger et de les compresser, etc ... (Ils sont super optimisé)

Qu'est-ce que je l'ai fait est de séparer le code des fonctions en javascript et le mettre dans le fichier header.php Situé sur le contenu de \ thèmes Route \ <votre thème> \ de header.php juste avant la fermeture de la tête.

<scénario type="Text / javascript"> <! - <JavaScript SD pour Facebook Like Button /> -> fonction activate_fa () {(fonction(D, s, id) { var js, fjs = d.getElementsByTagName (s) [0]; if (D.getElementById (id)) retour; js = d.createElement (s); js.id = id; js.src = "//connect.facebook.net/es_LA/all.js#xfbml=1"; fjs.parentNode.insertBefore (js, FJS); } (Document, 'Script', 'Facebook-jssdk')); } <! - <JavaScript SD pour Comme Bouton Google Plus /> -> fonction activate_gp () {fenêtre .___ gcfg = {lang: 'es'}; (fonction() { var po = document.createElement ('Script'); Po.type = 'Text / javascript'; Po.async = vrai; po.src = 'Https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName ('Script') [0]; s.parentNode.insertBefore (po, s);}) ();} <- <JavaScript SD pour Twitter Button /> -> fonction activate_tw () {!fonction (D, s, id) { var js, fjs = d.getElementsByTagName (s) [0];if(D.getElementById (id)!) {Js = d.createElement (s); js.id = id; js.src ="/ / Platform.twitter.com / widgets.js"; Fjs.parentNode.insertBefore (js, fjs);}} (document,"Script","Twitter-WJS"); } </scénario>

J'ai créé un widget HTML et j'ai le code qui affiche les images dans plusieurs div. Ce morceau de code est ce qui va afficher les boutons des réseaux sociaux. Adaptadlos pour lesquelles vous pourriez avoir.

<div classe="G-plusone" les données de taille="Medium" données href="Http://www.megacrack.es" onMouseOver="Activate_gp ()">
<IMG SRC="../files/gplus.png" largeur=35 la taille=23>
</div>
<div>
<a href="Https://twitter.com/megacracks" classe="Twitter-suivi-bouton"
 données-show-count="True" Show-screen-nom de données="Faux" données-lang="Il est" onMouseOver="Activate_tw ()">
<IMG SRC="../files/seguir.png" largeur=62 la taille=22></A></div>
<div classe="Fb-like" données href="Http://www.megacrack.es" données send="Faux" agencement des données="Button_count"
 les données de largeur="100" données-show-faces="Faux" onMouseOver="Activate_fa ()" >
<div classe="Fb-like" données href="Http://www.megacrack.es" données send="Faux" agencement des données="Button_count"
 les données de largeur="100" données-show-faces="Faux" onMouseOver="Activate_fa ()" ></div>
<IMG SRC="../files/megusta.png" largeur=74 la taille=24></div>

Fonctionne très bien sauf pour facebook ne sais pas comment y remédier. (Si quelqu'un m'aide à être reconnaissants et aussi de la communauté).

Pour déployer prestashop

Dans prestashop est un peu plus compliqué, mais vous pouvez aussi le faire.

Ce que nous faisons est d'éditer le fichier header.tpl vous trouverez à l'emplacement suivant sur votre FTP ou votre fournisseur d'hébergement pour prestashop: public_html \ themes \ default \ header.tpl

Agregad les lignes de code suivantes juste avant la fermeture de la tête.

<scénario type="Text / javascript">

 fonction activate_fa () {(fonction(D, s, id) {
	  var js, fjs = d.getElementsByTagName (s) [0];
	  if (D.getElementById (id)) retour, Js = d.createElement (s); js.id = id; js.src = "//connect.facebook.net/es_LA/all.js#xfbml=1"; Fjs.parentNode.insertBefore (js, fjs);} (document, 'Script',  'Facebook-jssdk'));}

fonction activate_gp () {
	var po = document.createElement ('Script'); Po.type = 'Text / javascript'; Po.async = vrai; Po.src = 'Https://apis.google.com/js/plusone.js';
	
	var s = document.getElementsByTagName ('Script') [0]; s.parentNode.insertBefore (po, s);}

fonction activate_tw () {!fonction (D, s, id) {
	var js, fjs = d.getElementsByTagName (s) [0];if(D.getElementById (id)!) {Js = d.createElement (s); js.id = id; js.src ="//platform.twitter.com/widgets.js"; Fjs.parentNode.insertBefore (js, fjs);}} (document,"Script","Twitter-WJS"); }
</scénario>

Lorsque vous avez fait cela aurez besoin d'un addon prestashop appelé HTMLBOX que vous pouvez télécharger à partir de http://mypresta.eu/modules/front-office-features/html-box.html.

Maintenant que vous devrez activer le module dans sa configuration et ajoutez le code suivant:

Les premières lignes de code, vous pouvez partir sans mettre (pour obtenir un look est identique à celle des autres modules de la version de prestashop 1.5.3)

<P class = "title_block" style = "background-color: # 383838, padding: 6px 11px;

color: # fff; text-shadow: # 0 1 0 000 px; font-size: 12px; font-weight: bold; "> CLIQUEZ COMME AIDE</p>

Ce morceau de code est ce qui va afficher les boutons des réseaux sociaux. Adaptadlos pour lesquelles vous pourriez avoir.

<p>

<div classe="Fb-like" données href="Http :/ / www.venlotodo.com" données send="Faux"
 agencement des données="Button_count" données-show-faces="Faux" ></div>
<div classe="Fb-like" données href="Http :/ / www.venlotodo.com" onMouseOver="Activate_fa ()"
 données send="Faux" agencement des données="Button_count" données-show-faces="Faux" >
<IMG SRC="../files/megusta.png" largeur=74 la taille=24>
</div>

<div classe="G-plusone" données href="Http :/ / www.venlotodo.com" les données de taille="Medium"
 onMouseOver="Activate_gp ()">
<IMG SRC="../files/gplus.png" largeur=35 la taille=23>
</div>

<div>
<a href=«Https :/ / twitter.com / share" classe="Twitter-share-button" données url="Http :/ / www.venlotodo.com"
 données-lang="Il est" onMouseOver="Activate_tw ()">
<IMG SRC=".. / Files / twittear.png" largeur=62 la taille=22></A></div>
</p>

C'est tout, j'espère que vous avez appris dans leurs efforts pour améliorer la qualité du site et si vous avez des problèmes de laisser un message et tenter de répondre.

Les fichiers avec des images de boutons sociaux compressés

Comme je l'ai promis avant mon départ les fichiers image de comprimés de réseautage social et prêts à télécharger:

Twitter -> http://www.megacrack.es/files/seguir.png

Google Plus -> http://www.megacrack.es/files/gplus.png

Facebook -> http://www.megacrack.es/files/megusta.png

Mots clés: , , , , , , , , ,
Publié par la performance Web | Pas de commentaires »

Aujourd'hui est mon anniversaire et je félicite Google

Publié par Xaus Xavier Nadal 26th sur Octobre 2012

Anniversaires

J'ai vraiment aimé les cartes, j'ai été agréablement surpris.

Mots clés:
Publié par Général | 1 commenter »

5 Android apps que tout le monde devrait avoir

Publié par Xaus Xavier Nadal 29th sur Septembre 2012

Aujourd'hui, je vais montrer 5 Android apps que tout le monde devrait avoir,et pour tous ceux qui ont un smartphone et que vous souhaitez obtenir plus de l'appareil encore, sont des outils qui devraient avoir tout ou au moins les connaître.

Ce sont des applications que j'utilise tous les jours et je suis très heureux avec chacun d'entre eux.

Je mets 5 mais il y a beaucoup plus d'applications que vous mettez peut-être plus tard, mais pour l'instant tu es pensez que vous aimerez beaucoup et espère que vous les aimez comme je le fais.

Déjà vous me dire s'ils ont été à votre goût et si vous voulez, vous pouvez poster un commentaire avec lequel vous vous utilisez.

Continuez à lire l'article si vous voulez connaître tous les outils que je suis fixés.

Megacrack lire »

Mots clés: , , , , , , , , , , , , , , , , ,
Publié par androïde | 1 commenter »

Voulez-vous lire notre blog à partir de votre smartphone ou tablette?

Publié par Xaus Xavier Nadal 31st mai 2012

Cliquez sur le lien ci-dessous et télécharger le Courants Google.

Ce service que nous offrons à des milliers de lecteurs depuis Décembre 2010, mais nous n'avions pas posté sur le blog.

Voici le lien.

https://www.google.com/producer/editions/CAow5Pg0/wwwmegacrackes

Salutations.

Mots clés: , , , , , , , ,
Publié par Google | Pas de commentaires »

Annoncez dans Blogger

Publié par Xaus Xavier Nadal 29th sur Avril 2012

Aujourd'hui, nous allons vous expliquer comment insérer un code de la publicité dans votre technologie de blog Blogger développé sous, faisons un peu plus compliqué que d'habitude, je l'explique:

Cet article va arriver à placer une annonce dans un article par le blogueur, mais cela apparaît sur la page d'accueil Blog parce que vous savez que vous avez des politiques d'utilisation des adsense nous empêchent de mettre plus de 3 blocs publicitaires du même type sur la même page.

La première chose à faire est d'accéder à l'administration de notre gestionnaire de compte Adsense ou de la publicité que vous avez, et obtenir le code de la publicité qui convient le mieux à vos mesures de blog.

Par exemple le code que nous avons choisi aujourd'hui est la suivante: une bannière de 468 60 ×

<Script type = "text / javascript"> <! -
google_ad_client = "ca-pub-2342147052953367";
/ * Contessota * /
google_ad_slot = "6351243105";
google_ad_width = 468;
google_ad_height = 60;
// ->
</ Script>
<Script type = "text / javascript"
src = "http://pagead2.googlesyndication.com/pagead/show_ads.js”>
</ Script>

Lorsque vous avez le code pulsáis sur un de ces liens 2 convertissent le code HTML en texte brut blogueur tout à fait compréhensible.

http://nosetup.org/php_on_line/convertir_html_texto

http://blogcrowds.com/resources/parse_html.php

Nous devrions ressembler à quelque chose comme ce qui suit:

& Lt; script type = & quot; text / javascript & quot; & gt; & lt ;! -
google_ad_client = & quot; ca-pub-2342147052953367 & quot ;;
/ * Contessota * /
google_ad_slot = & quot; & quot ;; 6351243105
google_ad_width = 468;
google_ad_height = 60;
// - & Gt;
& Lt; / script & gt;
& Lt; script type = & quot; text / javascript & quot;
src = & quot; http: //pagead2.googlesyndication.com/pagead/show_ads.js&quot; & gt;
& Lt; / script & gt;

A partir de ce moment, nous ne définissons où placer la publicité sur notre blog.

Blogger nous accéder à notre compte d'administrateur de blog et nous sommes situés dans le menu Modèle.

Megacrack lire »

Mots clés: , , , , , , , , , , , , , ,
Publié par active Directory, Google, publicité | Pas de commentaires »