Schließlich wird die Hilfe von IT ist hier

Blog von Computer-Lösungen.

Verbesserung der Website-Performance (Social-Tasten)

Geschrieben von Xaus Xavier Nadal 17th am März 2013

Heute zeigen wir Ihnen, wie Website-Performance zu verbessern, indem sie die sozialen Tasten Facebook, Twitter und Google Plus sind auf dem Netz geladen, aber nur, wenn wir die Maus übergehen.

Wie jeder weiß, ich bin begeistert von Web-Performance zu verbessern und Sie können in diesem Blog Beispiele dafür sehen.

Wir haben sehr gute Ergebnisse, auch wenn mangels an einem gemeinsamen Laden von Teig ohne VPS-Hosting.

Eine der neuesten Entwicklungen, die umgesetzt haben, hat die Last der Sandwiches ärgerlich sozialen Netzwerken gewesen Teil der Partitur in den Performance-Test-Seiten zu bekommen als http://www.webpagetest.orgoder http://www.gtmetrix.com Sie machten die Bahn langsamer lädt eine Abnahme der Google Positionierung unter anderen Suchmaschinen zu verursachen.

Um das zu umgehen dieses Problem werde ich einige Beispiele zeigen, leben, so dass es auf jede Ihrer Websites anpassen können.

  • Die Website lädt ein 55% schneller.
  • Wordpress -> Sie können das Ergebnis in diesem Blog zu sehen http://www.megacrack.es.
  • Prestashop -> Sie sehen das Ergebnis in http://www.venlotodo.com (Homepage alle Arten von Produkten, darunter Sexshop mit beeindruckenden Preisen verkaufen (senden Sie eine E-Mail an ventas@venlotodo.com und sagen, dass Sie kommen und Sie werden eine MegaCracks machen Versicherung RabattSchade ist.), Dass nur nach Spanien zu verkaufen, und auch, wenn Sie mit ihnen in der Provinz Barcelona sprechen sind und der Preis sogar noch besser).

Für Sie die Änderung zu sehen, können Sie den folgenden Link Vergleich der Geschwindigkeit beim Laden zwischen den Standorten verwenden 2 http://whichloadsfaster.com/.

Ich halte mich für die Programmierung recht nicht in der Lage, aber ich bin ganz geschickt in der Kunst der Logik und zu verstehen, wie die Dinge funktionieren und vor allem Ich mag, was ich tue, und investieren, um die Zeit es braucht. (Ich sage das, weil ich bin sicher, dass der Quellcode stark mit Ihren Kommentaren verbessert werden kann, und wenn man die Gemeinschaft Vorteile machen kann, wird es Ihnen aus diesem Blog danken Ihre Verbesserungsvorschläge zu sehen).

Zur Implementierung auf einem beliebigen Web mit HTML

Dann wird der Quellcode der Web-I unterrichten (HTML) Was wir tun, ist es, mehrere Bilder der gleichen Tasten haben wir auf Facebook, Twitter haben und Google plus und wenn Sie über mit einem Javascript-Funktion aufrufen schweben, die das Skript von jedem der sozialen Elemente ausgelöst.

<html>
<Körper>

<div Klasse="G-plusone" Daten-Größe="Medium" Daten-href="Http://www.megacrack.es" onMouseOver="Activate_gp ()">
<IMG SRC="../files/gplus.png" Breite=35 Höhe=23>
</div>
<div>
<a href="Https://twitter.com/megacracks" Klasse="Twitter-Follow-Button"
 Daten-show-count="True" Daten-show-Bildschirm-Name="False" Daten-lang="Es ist" onMouseOver="Activate_tw ()">
<IMG SRC="../files/seguir.png" Breite=62 Höhe=22></A></div>
<div Klasse="Fb-like" Daten-href="Http://www.megacrack.es" Daten-send="False" Daten-Layout="Button_count"
 Datenbreite="100" Daten-show-Gesichter="False" onMouseOver="Activate_fa ()" >
<div Klasse="Fb-like" Daten-href="Http://www.megacrack.es" Daten-send="False" Daten-Layout="Button_count"
 Datenbreite="100" Daten-show-Gesichter="False" onMouseOver="Activate_fa ()" ></div>
<IMG SRC="../files/megusta.png" Breite=74 Höhe=24></div>

<Skript Typ="Text / javascript">

	<! - <JavaScript SD das Facebook Like Button /> ->
	Funktion activate_fa () {(Funktion(D, s, id) {
		  war js, fjs = d.getElementsByTagName (e) [0];
		  if (D.getElementById (id)) Rückkehr; js = d.createElement (s); js.id = id; js.src = "//connect.facebook.net/es_LA/all.js#xfbml=1"; fjs.parentNode.insertBefore (js, fjs); } (Dokument, 'Script',  'Facebook-jssdk')); } <! - <JavaScript SD das Like Button Google Plus /> ->
	Funktion activate_gp () {Fenster .___ gcfg = {lang: 'es'}; (Funktion() {
			war po = document.createElement ('Script'); po.type = "Text / javascript"; po.async = was diese Dinge sind.; po.src = 'Https://apis.google.com/js/plusone.js';
			
			war s = document.getElementsByTagName ('Script') [0]; s.parentNode.insertBefore (po, s); }) (); } <! - <JavaScript SD das Twitter-Knopf /> ->	
	Funktion activate_tw () {!Funktion (D, s, id) {
			war js, fjs = d.getElementsByTagName (e) [0];if= {Js d.createElement (n) (D.getElementById (id)!); Js.id = id; js.src ="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore (js, fjs); }} (Dokument,"Script","Twitter-wjs"); }
</Skript>

</Körper>
</html>

Zur Umsetzung in Wordpress

Zunächst einmal müssen Sie Ihre Bilddateien laden mit solchen RIOT (zum Komprimieren von Bildern Beeindruckende Programm) optimiert, um so effizient wie möglich auf Ihre Wordpress-Dateien im Ordner zum Beispiel zu sein. Am Ende des Artikels werde ich den Link zu den PNG-Dateien lassen, so seien sie nicht das Herunterladen und komprimieren sie, etc ... (Sie sind super Optimized)

Was ich getan habe ist, den Code der Funktionen in Javascript zu trennen und sie in der Datei setzen header.php Das Hotel liegt auf der Route wp-content \ themes \ <Ihr Thema> \ header.php kurz vor den Kopf zu schließen.

<Skript Typ="Text / javascript"> <! - <JavaScript SD das Facebook Like Button /> -> Funktion activate_fa () {(Funktion(D, s, id) { war js, fjs = d.getElementsByTagName (e) [0]; if (D.getElementById (id)) Rückkehr; js = d.createElement (s); js.id = id; js.src = "//connect.facebook.net/es_LA/all.js#xfbml=1"; fjs.parentNode.insertBefore (js, fjs); } (Dokument, 'Script', 'Facebook-jssdk')); } <! - <JavaScript SD das Like Button Google Plus /> -> Funktion activate_gp () {Fenster .___ gcfg = {lang: 'es'}; (Funktion() { war po = document.createElement ('Script'); po.type = "Text / javascript"; po.async = was diese Dinge sind.; Po.src = 'Https://apis.google.com/js/plusone.js'; war s = document.getElementsByTagName ('Script') [0]; s.parentNode.insertBefore (po, s); }) (); } <! - <JavaScript SD das Twitter-Knopf /> -> Funktion activate_tw () {!Funktion (D, s, id) { war js, fjs = d.getElementsByTagName (e) [0];if= {Js d.createElement (n) (D.getElementById (id)!); Js.id = id; js.src ="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore (js, fjs); }} (Dokument,"Script","Twitter-wjs"); } </Skript>

Ich habe ein HTML-Widget und ich habe das Stück Code, der die Bilder in mehreren div anzeigt. Dieses Stück Code ist das, was die Tasten von sozialen Netzwerken zeigen. Adaptadlos, für die Sie haben.

<div Klasse="G-plusone" Daten-Größe="Medium" Daten-href="Http://www.megacrack.es" onMouseOver="Activate_gp ()">
<IMG SRC="../files/gplus.png" Breite=35 Höhe=23>
</div>
<div>
<a href="Https://twitter.com/megacracks" Klasse="Twitter-Follow-Button"
 Daten-show-count="True" Daten-show-Bildschirm-Name="False" Daten-lang="Es ist" onMouseOver="Activate_tw ()">
<IMG SRC="../files/seguir.png" Breite=62 Höhe=22></A></div>
<div Klasse="Fb-like" Daten-href="Http://www.megacrack.es" Daten-send="False" Daten-Layout="Button_count"
 Datenbreite="100" Daten-show-Gesichter="False" onMouseOver="Activate_fa ()" >
<div Klasse="Fb-like" Daten-href="Http://www.megacrack.es" Daten-send="False" Daten-Layout="Button_count"
 Datenbreite="100" Daten-show-Gesichter="False" onMouseOver="Activate_fa ()" ></div>
<IMG SRC="../files/megusta.png" Breite=74 Höhe=24></div>

Es funktioniert sehr gut, außer für Facebook nicht wissen, wie es zu beheben. (Wenn jemand hilft, mich dankbar und Gemeinschaft auch).

Zur Umsetzung in prestashop

In prestashop ist es etwas komplizierter, aber es kann getan werden.

Was wir tun, ist die Datei bearbeiten header.tpl Sie werden in den folgenden Pfad auf Ihrem FTP oder von Ihrem Hosting-Provider für Prestashop finden: public_html \ themes \ default \ header.tpl

Agregad die folgenden Zeilen Code kurz vor den Kopf zu schließen.

<Skript Typ="Text / javascript">

 Funktion activate_fa () {(Funktion(D, s, id) {
	  war js, fjs = d.getElementsByTagName (e) [0];
	  if (D.getElementById (id)) Rückkehr; js = d.createElement (s); js.id = id; js.src = "//connect.facebook.net/es_LA/all.js#xfbml=1"; fjs.parentNode.insertBefore (js, fjs); } (Dokument, 'Script',  'Facebook-jssdk')); }

Funktion activate_gp () {
	war po = document.createElement ('Script'); po.type = "Text / javascript"; po.async = was diese Dinge sind.; po.src = 'Https://apis.google.com/js/plusone.js';
	
	war s = document.getElementsByTagName ('Script') [0]; s.parentNode.insertBefore (po, s); }

Funktion activate_tw () {!Funktion (D, s, id) {
	war js, fjs = d.getElementsByTagName (e) [0];if= {Js d.createElement (n) (D.getElementById (id)!); Js.id = id; js.src ="//platform.twitter.com/widgets.js"; Fjs.parentNode.insertBefore (js, fjs); }} (Dokument,"Script","Twitter-wjs"); }
</Skript>

Wenn Sie dies getan haben, werden Sie ein Addon namens brauchen HTMLBOX Prestashop, die Sie von herunterladen http://mypresta.eu/modules/front-office-features/html-box.html.

Jetzt nur werden Sie das Modul in der Konfiguration aktivieren müssen, und fügen Sie den folgenden Code:

Die ersten Zeilen des Codes ohne setzen lassen (bis zu derjenigen der anderen Module in 1.5.3 Version von Prestashop Aussehen identisch bekommen)

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

Farbe: #fff; text-shadow: 0 1 0 px #000; font-size: 12px; font-weight: bold; "> KLICKEN SIE WIE HELP</p>

Dieses Stück Code ist das, was die Tasten von sozialen Netzwerken zeigen. Adaptadlos, für die Sie haben.

<p>

<div Klasse="Fb-like" Daten-href="Http://www.venlotodo.com" Daten-send="False"
 Daten-Layout="Button_count" Daten-show-Gesichter="False" ></div>
<div Klasse="Fb-like" Daten-href="Http://www.venlotodo.com" onMouseOver="Activate_fa ()"
 Daten-send="False" Daten-Layout="Button_count" Daten-show-Gesichter="False" >
<IMG SRC="../files/megusta.png" Breite=74 Höhe=24>
</div>

<div Klasse="G-plusone" Daten-href="Http://www.venlotodo.com" Daten-Größe="Medium"
 onMouseOver="Activate_gp ()">
<IMG SRC="../files/gplus.png" Breite=35 Höhe=23>
</div>

<div>
<a href="Https://twitter.com/share" Klasse="Twitter-share-Button" Daten-URL="Http://www.venlotodo.com"
 Daten-lang="Es ist" onMouseOver="Activate_tw ()">
<IMG SRC="../files/twittear.png" Breite=62 Höhe=22></A></div>
</p>

Das ist alles, ich hoffe, Sie haben gelernt, wie sie arbeiten, Web-Seite die Leistung zu verbessern, und wenn Sie irgendwelche Probleme haben, eine Nachricht lassen und versuchen zu beantworten.

Dateien, die mit sozialen Schaltfläche Bilder komprimiert

Wie ich versprochen, bevor ich die Bilddateien von Social-Networking-Tabletten und zum Download bereit verlassen:

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

Stichworte: , , , , , , , , ,
Geschrieben von Web-Performance | Keine Kommentare »

Wayback Machine oder wieder Zeit im Internet zu ziehen.

Geschrieben von Xaus Xavier Nadal 31st am Oktober 2012

Der Titel des Artikels Wayback Machine oder ziehen wieder Zeit auf dem Internet scheint etwas Unwirkliches, etwas futuristisch, aber in Wirklichkeit kann es durch eine gemeinnützige Einrichtung, dass 10 Petabyte an Informationen in ihrem Besitz es möglich, die Zeit, die wir wieder auf dem Internet zu ziehen ist getan werden kann, finden Sie einen Screenshot von einer Webseite Seit den Anfängen bis heute, die Entwicklung von jeder Website, jede Internet-Geschäft, wie alles begann, wie auch die alte statische HTML-Format, wie sie in HTML 5 entwickelt haben.

Nur müssen Sie die folgende Web-Zugriff http://archive.org/web/web.php und schreiben Sie Ihre Website Die Wayback Machine und klicken Sie auf Take Me Back.

Sie haben rund 150 Milliarden Web-Seiten aus 1996 bis vor ein paar Wochen archiviert.

Wenn Sie mehr Informationen möchten, können Sie darüber in den folgenden Link lesen: http://archive.org/about/

Dafür ist die Big Data, Um die größte Menge an gespeicherten Daten und Werkzeuge in der Lage, diese Daten zu bewegen und bietet Kunden damit ein Ergebnis der Suche mit sehr niedrigen Latenzen haben.

Hier sehen Sie die Entwicklung dieses Blogs:

Seit seiner Gründung im 2008 549 und in einer Momentaufnahme sieht die 25 2008 März.

Megacrack lesen »

Stichworte: , , , , ,
Geschrieben von Big Data | Keine Kommentare »

Online entwickelt JavaScript, HTML und CSS.

Geschrieben von Xaus Xavier Nadal 28th am Oktober 2012

JsFiddle oder, wie sie es "Freizeitpark für Web-Entwickler" nennen, ist eine große Web-Tool, das in vielerlei Hinsicht verwendet werden können, wie zum Beispiel Online-Editor JavaScript-Schnipsel, HTML und CSS-Code zu erstellen, unseren Quellcode zu teilen und andere testeen Menschen und die Ergebnisse direkt zu sehen, auf einem einfachen und freundlichen Website ausgeführt wird.

Mit dieser Web-Entwickler können leicht Fehler und die Ergebnisse in Echtzeit zu isolieren, auch überprüfen, ob der Code korrekt JavaScript kompiliert.

In der Produktschnittstelle 3 wir verschiedene Bereiche zu arbeiten, an der Spitze wir die Symbole sehen können, um den Code auszuführen, speichern, gemeinsam nutzen, auf der linken Seite haben wir verschiedene Optionen ändern können, die richtigen Platten, die Werkzeuge enthalten bekommen notwendig, um die gewünschten Ergebnisse aus Modifizierung der Platten zu erreichen, den Programmiercode, SCSS, Coffeescript, JavaScript, etc. zu ändern ..

Und die Magie in den richtigen Platten 4, HTML, CSS, JavaScript und Ergebnis, wo der RUN-Taste drücken, die Ergebnisse unserer Code zu sehen.

Ich lasse ein Beispiel und lassen Sie mich wissen, wenn Sie diese Website hilfreich gewesen sein (http://jsfiddle.net/B6Jsy/50/)

Im Beispiel habe ich einen Teil von CSS und andere HTML-Code Adsense Werbung 2 Module in einem Block mit Margen zwischen ihnen und mit einer zentrierten Ausrichtung zu setzen.

Wie Sie in den HTML-Code sehen können, nenne ich die Klasse "publidiv"Ich stellte im Stylesheet (CSS) und so kann ich es auf der Website überall dort verwenden, nur die Klasse aufrufen publidiv o Publi für die AdSense Werbeinhalte, die immer zentriert.

Megacrack lesen »

Stichworte: , , , , ,
Geschrieben von Programmierung | Keine Kommentare »

Werbung in Blogger

Geschrieben von Xaus Xavier Nadal 29th am April 2012

Heute werden wir erklären, wie ein Werbecode in Ihrem Blogger-Blog-Technologie unter entwickelt einzufügen, lassen Sie uns als üblich ein wenig komplizierter machen, ich erklären:

Dieser Artikel wird erhalten eine Anzeige in einem Artikel von Blogger zu platzieren, aber das erscheint auf der Startseite Blog denn wie Sie wissen, dass Sie AdSense-Nutzungsrichtlinien haben uns daran hindern, mehr als 3 Werbeblöcke des gleichen Typs auf der gleichen Seite setzen.

Das erste, was zu tun ist, die Verwaltung unserer AdSense-Account-Manager oder Werbung zugreifen, die Sie haben, und die Werbung Code, der am besten Ihren Blog Maßnahmen.

Zum Beispiel der Code, den wir heute gewählt haben, ist dies: ein Banner von 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>

Wenn Sie den Code pulsáis auf einen dieser Links 2 den HTML-Code in Klartext völlig verständlich Blogger konvertieren.

http://nosetup.org/php_on_line/convertir_html_texto

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

Wir sollten in etwa wie folgt aussehen:

& 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;

Von diesem Moment definieren wir, wo nur der Werbung in unserem Blog platzieren.

Blogger greifen wir auf unser Konto Blog-Administrator, und wir sind auf dem Menü befindet Vorlage.

Megacrack lesen »

Stichworte: , , , , , , , , , , , , , ,
Geschrieben von Active Directory, Google, Werbung | Keine Kommentare »

Entwickler-Community (WikiCode)

Geschrieben von Xaus Xavier Nadal 18th am August 2011

gut,

Heute für Sie, die immer mit Quellcode Messing ich eine der größten Gemeinden der zukünftigen Programmierumgebungen übergeben und zur Zeit sehr schnell wächst.

WikiCode

Gemeinschaft basiert auf dem Austausch von Code, der mit der Absicht, zu einem Referenz in der Programmierung erstellt wird.

Bis bald.

Stichworte: , , , , , , , , , , , , , ,
Geschrieben von androide, iphone, Programmierung | Keine Kommentare »