Warum registrieren? Nur als registriertes Mitglied vom ABAKUS Forum hast Du vollen Zugriff auf alle Funktionen unserer Website.

HowTo: TheMoneytizer Code optimiert einbauen

Alles zum Thema Google Adsense.
supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 31.01.2019, 18:58

----> Hanzo2012 <----- Bei Bedarf verschieben

In enger Anlehnung an das HowTo um den Adsense Code

https://www.abakus-internet-marketing.d ... 41455.html

optimiert einzubauen, gibts hier das HowTo für TheMoneytizer. Das auch vor dem Hintergrund, dass viele glauben man könnte das HowTo für Adsense für jedes andere Script genauso verwenden. Das geht aber nicht, weil die Art wie die notwendigen Scripte implementiert werden müssen sich dann doch stark unterscheiden. Bei TheMoneytizer besteht besonderer Handlungsbedarf, weil entgegen der offiziellen Aussage von TheMoneytizer die Scripte synchron geladen werden. Das hat jedoch zur Folge, dass der Seitenaufbau massiv ausgebremst wird. Mit der nachfolgenden Anleitung sollte/wird das spürbar besser werden.

Voraussetzung damit das funktioniert ist das jQuery Framework, aber nicht von extern irgendwoher nachgeladen, sondern vom gleichen Server auf dem auch die eigene Seite läuft. Zu beachten gilt auch, dass es ja nach Anwendung/Applikation und etwaig anderer Modifikationen hinsichtlich eines geänderten Ladeverhaltens von Scripten sein kann, dass Ihr diese Anleitung bei Euch nicht verwenden könnte. Das gilt insbesondere dann, wenn Ihr irgendwelche Plugins für z.B: Wordpress verwendet, die das Ladeverhalten von jQuery beeinflusst. Das Gleiche gilt auch bei einem Mischbetrieb, wenn Ihr Adsense, Moneytizer und was sonst noch gleichzeitig/parallel verwendet. In so einem Fall muss man individuell ran, also fragt bitte nicht, warum es nicht funktioniert, wenn Ihr mehrere Scripte für Anzeigen verwendet. Ein weiteres Ausschlusskriterium sind jQuery Plugins, die zusätzlich zum Framework geladen werden. Ist dies der Fall probiert es gleich gar nicht, weil die Plugins nicht mehr funktionieren werden. Dafür sind besondere Maßnahmen notwendig!!! Gleiches gilt auch für Inline Scripte/Funktionen, die innerhalb des <body></body aufgerufen werden. Auch diese werden nicht mehr funktionieren! Auch dafür braucht es eine eigene und individuelle Lösung.

Und nicht zuletzt gilt: Wer lesen kann, ist klar im Vorteil!

Anlass etwas optimieren zu müssen, liegt dem Problem zu Grunde, dass der vom Server ausgelieferte Code keiner Priorität unterliegt. Der Server schickt einfach und der Browser versucht so viel möglich gleichzeitig zu laden und zu verarbeiten. Das klappt aber in den wenigsten Fällen und besonders dann nicht, wenn es schlichtweg zu viel gibt, was er verarbeiten muss. Noch schlimmer wirds, wenn zusätzlich noch externe Sachen von anderen Servern geladen werden müssen. Dafür gäbe es zwar Mechanismen, die Objekte, die nicht sofort verfügbar sein müssen, verzögert laden und verarbeitet werden. Leider nehmen hier nicht wenige Anbieter Rücksicht darauf und berücksichtigen solce Mechanismen nicht, obwohl es fast schon Old School ist, wie und dass man so was macht. Die Scripte für Anzeigen sind dabei der Klassiker und sorgen nicht selten für einen ausgebremsten Seitenaufbau. TheMoneytizer scheint hier ein besonder Problemfall zu sein, was auch an der Art und Weise liegt, wie diese Anzeigen, bzw. der Code dafür eingebaut werden müssen.

Um die Voraussetzungen zu schaffen, muss zunächst das Ladeverhalten von jQuery verändert werden. Wer jQuery nicht verwendet, braucht nicht weiterlesen und extra für diese Anleitung einbauen lohnt nicht.

Nachdem jQuery selbst schon eine Störquelle beim Seitenaubau darstellt, bringen wir zunächst jQuery dazu, dass dieses verzögert ("deferred") geladen wird. Dabe ist es wichtig, dass das nachfolgende Script im <head></head>, also im Kopf nach den CSS Anweisung eingebaut wird und nicht wie viele glauben am Ende der Seite. Das gilt nicht generell, sondern nur dann, wenn man Scripte mit der Defer Methode integriert, weil nur so das verzögerte Laden richtig funktioniert.

Code: Alles auswählen

<head>
<script>
var cb = function &#40;&#41; &#123;
    var l = document.createElement&#40;"script"&#41;;
    l.src = "https&#58;//absoluter-Pfad-zur-jQuery-Datei/jquery.js";
    var h = document.getElementsByTagName&#40;"head"&#41;&#91;0&#93;;
    h.parentNode.insertBefore&#40;l, h&#41;;
&#125;;
var raf = requestAnimationFrame || mozRequestAnimationFrame || webkitRequestAnimationFrame || msRequestAnimationFrame;
if &#40;raf&#41;
    raf&#40;cb&#41;;
else
    window.addEventListener&#40;"load", cb&#41;;
</script>
</head>

Die Anzeigen für TheMoneytizer werden nach meinem Kenntnisstand wie folgt eingebaut:

Vorher:

Code: Alles auswählen

<div id="xxxxx-y">
<script src="//ads.themoneytizer.com/s/gen.js?type=y"></script>
<script src="//ads.themoneytizer.com/s/requestform.js?siteId=xxxxx&formatId=y"></script>
</div>


Nachher:

Code: Alles auswählen

<div id="xxxxx-y">
<script id="Eindeutige-und-unique-ID-Deiner-Wahl" src=""></script>
<script id="Eindeutige-und-unique-ID-Deiner-Wahl" src=""></script>
</div>

Abschließend das jQuery Framework mit eines Text Editor (z.B. Notepad), aber nicht MS Word öffnen und den nachfolgenden Schnipsel am Ende des Codes integrieren:

Code: Alles auswählen

$&#40;document&#41;.ready&#40;function&#40;&#41; &#123;
$&#40;"#ID-des-ersten-Scripts"&#41;.attr&#40;"src", "https&#58;//ads.themoneytizer.com/s/gen.js?type=y"&#41;;
$&#40;"#ID-des-zweiten-Scripts"&#41;.attr&#40;"src", "https&#58;//ads.themoneytizer.com/s/requestform.js?siteId=xxxxx&formatId=y"&#41;;
&#125;&#41; 
Die obige Anleitung bewirkt nun, dass zunächst jQuery verzögert geladen wird. Mit einer Pseudo Defer Methode werden die TheMoneytizer Scripte per AJAX durch das verzögerte Laden von jQuery ebenso verzögert geladen werden und blockieren nicht mehr länger den Seitenaufbau. Es dürfte sich von selbst verstehen, dass diese Anleitung, bzw. die geänderte Integration der TheMoneytizer Scripte je nach Bedarf, bzw. Menge an Anzeigen und deren Pfade zu den Scripten ggf., aber nach dem gleichen Schema erweitert werden müssen/können.

Ihr werdet nach erfolgreichem Einbau ein verzögertes Anzeigen der Anzeigen feststellen. Die Verzögerungszeit hängt aber von der verfügbaren Internet Geschwindigkeit ab, dürfte aber für gewöhnlich nicht mehr als 1,5 bis 3 Sekunden sein.
Zuletzt geändert von supervisior am 01.02.2019, 17:39, insgesamt 1-mal geändert.

Micha_Es
PostRank 4
PostRank 4
Beiträge: 197
Registriert: 23.03.2008, 20:29

Beitrag von Micha_Es » 01.02.2019, 16:21

Hi und vielen Dank für die Mühe!!!

Aber es funktioniert leider nicht.
Wie gesagt bin ich absoluter Laie, aber wo wird denn die Function downloadJSAtOnload definiert?

Code: Alles auswählen

function downloadJSAtOnload&#40;&#41; &#123;

themoneytizer
PostRank 1
PostRank 1
Beiträge: 11
Registriert: 17.08.2018, 11:34

Beitrag von themoneytizer » 01.02.2019, 16:56

Ergänzend zur Darstellung von supervisior:

Die The Moneytizer Ad Tags laufen gänzlich über JavaScript (native).

Die einzige Voraussetzung ist ein eindeutiges <div> -Element mit einer eindeutigen ID für jede Ihrer Anzeigen. Das jQuery Framework ist für den unten aufgeführten Code keine Voraussetzung. Der Code dient als Beispiel. Funktionen zur globaleren Anwendung des Skripts können natürlich zusätzlich eingebunden werden.

Code: Alles auswählen

window.onload = function&#40;&#41; &#123;
  var id = '1234567-8';
  var src1 = '//ads.themoneytizer.com/s/gen.js?type=3';
  var src2 = '//ads.themoneytizer.com/s/requestform.js?siteId=1234567&formatId=8';

  var divAdMoneytizer = document.getElementById&#40;'ad-moneytizer'&#41;;
  var divAd = document.createElement&#40;'div'&#41;;
  divAd.setAttribute&#40;'id', id&#41;;
  divAdMoneytizer.appendChild&#40;divAd&#41;;

  var myad = document.getElementById&#40;id&#41;;
  var script1 = document.createElement&#40;'script'&#41;;
  var script2 = document.createElement&#40;'script'&#41;;

  script1.src = src1;
  script2.src = src2;

  myad.appendChild&#40;script1&#41;;
  myad.appendChild&#40;script2&#41;;
&#125;

Hanzo2012
Community-Manager
Community-Manager
Beiträge: 1693
Registriert: 26.09.2011, 23:31

Beitrag von Hanzo2012 » 01.02.2019, 17:11

Anmerkung zum Code: Die Variable „myad“ ist überflüssig, da sie dasselbe Element enthält wie die davor genutzte Variable „divAd“.

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 01.02.2019, 17:54

themoneytizer hat geschrieben:Ergänzend zur Darstellung von supervisior:

Die The Moneytizer Ad Tags laufen gänzlich über JavaScript (native).
Ich hab nix gegenteiliges geschrieben?!

Native wäre an sich ja gut, wenn diese window.onload Funktion die einzige one-and-only onload Funktion wäre, aber durch diese Lösung gibts unvorhersehbare Verwerfungen, wenn es noch andere onload Funktionen gibt. Ziel der Lösung ist es alles, was auch nur den Anschein machen könnte den Seitenaufbau zu stören erstmal hinten dran zu stellen. Dazu gehört auch die Menge an Code zu minimieren. Wenn man zu jeder einzelnen Anzeige erstmal einen zusätzlichen Code Block definieren muss, um dieses Ziel zu erreichen, dann hilft auch die beste Lösung nichts, wenn sich dadurch der Code unnötig aufbläht. Man kann über Adsense sagen was man will, aber zumindest in Sachen Programmierung ist Google Euch einen deutlichen Schritt voraus, wenngleich man auch bei Adsense etwas, aber nur etwas nachhelfen muss.

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 01.02.2019, 17:56

Micha_Es hat geschrieben:Hi und vielen Dank für die Mühe!!!

Aber es funktioniert leider nicht.
Wie gesagt bin ich absoluter Laie, aber wo wird denn die Function downloadJSAtOnload definiert?

Code: Alles auswählen

function downloadJSAtOnload&#40;&#41; &#123;
Streich den Code Schnipsel raus. Man soll zu später Stunde nicht mehr solche Sachen schreiben.... ;) Hab die obige Anleitung korrigiert. Wenns bei Dir trotzdem nicht funktioniert, dann liegts mit großer Wahrscheinlichkeit an den genannten Ausschlusskriterien

Rem
PostRank 10
PostRank 10
Beiträge: 3809
Registriert: 08.12.2005, 18:45

Beitrag von Rem » 02.02.2019, 08:44

Und nicht zuletzt gilt: Wer lesen kann, ist klar im Vorteil!
Aha? Und es ist Dir nicht aufgefallen, dass der Code hier bei Adsense nix verloren hat?
Kostengünstige Fremdwährungstransfers und Umtausch (EUR, USD, GBP, CHF etc), eigene Konti in den USA, UK, AU und in UK. Ich empfehle Transferwise . Neu mit nahezu kostenloser Multiwährungs-Debit-Kreditkarte.

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 02.02.2019, 08:54

Warum ist das Dein Problem? Schau mal onTop. Ich hab Hanzo2012 darauf hingewiesen, dass er dieses Thema bei Bedarf verschieben soll. Wer lesen kann, ist immer noch klar im Vorteil.... ;)

Micha_Es
PostRank 4
PostRank 4
Beiträge: 197
Registriert: 23.03.2008, 20:29

Beitrag von Micha_Es » 04.02.2019, 13:52

@themoneytizer
window.onload = function() {
var id = '1234567-8';
var src1 = '//ads.themoneytizer.com/s/gen.js?type=3';
var src2 = '//ads.themoneytizer.com/s/requestform.js?siteId=1234567&formatId=8';

var divAdMoneytizer = document.getElementById('ad-moneytizer');
var divAd = document.createElement('div');
divAd.setAttribute('id', id);
divAdMoneytizer.appendChild(divAd);

var myad = document.getElementById(id);
var script1 = document.createElement('script');
var script2 = document.createElement('script');

script1.src = src1;
script2.src = src2;

myad.appendChild(script1);
myad.appendChild(script2);
}
Bedeutet das, dass ich diesen Codeschnipsel vor </body> platzieren kann und dann einen div Container brauche, oder baue ich den Code da ein, wo die Anzeige erscheinen soll? Der Hintergrund ist der: egal was ich mache - es funktioniert nicht.

Beispiel:

Code: Alles auswählen


<div id="1234567-8>
</div>

<script>
window.onload = function&#40;&#41; &#123;
  var id = '1234567-8';
  var src1 = '//ads.themoneytizer.com/s/gen.js?type=3';
  var src2 = '//ads.themoneytizer.com/s/requestform.js?siteId=1234567&formatId=8';

  var divAdMoneytizer = document.getElementById&#40;'ad-moneytizer'&#41;;
  var divAd = document.createElement&#40;'div'&#41;;
  divAd.setAttribute&#40;'id', id&#41;;
  divAdMoneytizer.appendChild&#40;divAd&#41;;

  var myad = document.getElementById&#40;id&#41;;
  var script1 = document.createElement&#40;'script'&#41;;
  var script2 = document.createElement&#40;'script'&#41;;

  script1.src = src1;
  script2.src = src2;

  myad.appendChild&#40;script1&#41;;
  myad.appendChild&#40;script2&#41;;
&#125;
</script>

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 04.02.2019, 14:18

Was spuckt denn die Developer Console aus, wenn Du die Seite aufrufst?

Micha_Es
PostRank 4
PostRank 4
Beiträge: 197
Registriert: 23.03.2008, 20:29

Beitrag von Micha_Es » 04.02.2019, 14:29

@supervisior
Ich habe auch mit deiner Variante herum experimentiert - kein Versuch war erfolgreich - leider.

Das einzige was funktioniert ist diese Methode

Dort wo die Anzeige erscheinen soll:

Code: Alles auswählen

<div id="12345-6"></div>

Vor </body>

Code: Alles auswählen

    <script>
        function downloadJSAtOnload&#40;&#41; &#123;
            var b = document.createElement&#40;"script"&#41;;
            b.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
            document.body.appendChild&#40;b&#41;

            var c = document.createElement&#40;"script"&#41;;
            c.src = "//ads.themoneytizer.com/s/gen.js?type=Y";
            document.body.appendChild&#40;c&#41;

            var d = document.createElement&#40;"script"&#41;;
            d.src = "//ads.themoneytizer.com/s/requestform.js?siteId=XXXXXX&formatId=X";
            document.body.appendChild&#40;d&#41;
        &#125;;
        if &#40;window.addEventListener&#41; &#123;
          window.addEventListener&#40;"load", downloadJSAtOnload, false&#41;
      &#125; else &#123;
          if &#40;window.attachEvent&#41; &#123;
              window.attachEvent&#40;"onload", downloadJSAtOnload&#41;
          &#125; else &#123;
              window.onload = downloadJSAtOnload
          &#125;
        &#125;;
    </script>
Die Seitenladezeit verringert sich erheblich und sowohl AdSense, wie auch Moneytizer werden erst dann geladen, wenn die Seite vollständig geladen ist.

Wie gesagt, ich bin ne Pflaume was JS angeht, aber warum soll das nicht funktionieren? Wäre über eine Aufklärung dankbar :-)

Micha_Es
PostRank 4
PostRank 4
Beiträge: 197
Registriert: 23.03.2008, 20:29

Beitrag von Micha_Es » 04.02.2019, 14:35

supervisior hat geschrieben:Was spuckt denn die Developer Console aus, wenn Du die Seite aufrufst?
TypeError: divAdMoneytizer is null

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 04.02.2019, 15:05

Erhebe bitte nicht den Anspruch, dass man jeden Code Schnipsel universell einstezen könnten. In Deinem Fall erst recht nicht, weil Du eine Mischkonstellation aus Adsense UND TheMoneytizer betreibst. Das kann ja nicht funktionieren. An Deiner Stelle würde ich sowohl meine Adsense Lösung als auch das vom The Moneytizer Support entfernen und suche Dir jemanden, der Dir etwas indiviuelles bastelt. Dir versuchen zu helfen ist das Gleiche als würde man mit einer Fernsteuerung eine andere Fernsteuerung, die ein Flugzeug fernsteuern soll. Dass das schief geht,ist abzusehen. Verstehst Du das?

Micha_Es
PostRank 4
PostRank 4
Beiträge: 197
Registriert: 23.03.2008, 20:29

Beitrag von Micha_Es » 04.02.2019, 18:07

Ich verstehe was du meinst.
Habe jedoch sämtlichen Moneytizer und AdSense Code entfernt und dann die beiden oben gezeigten Beispiele umgesetzt - leider ohne Erfolg. Was ich aber gerne verstehen möchte, warum der Code nicht funktionieren sollte, wenn er es "augenscheinlich" tut?:

Code: Alles auswählen

<div id="1234567-8>
</div>

<script>
        function downloadJSAtOnload&#40;&#41; &#123;
            var b = document.createElement&#40;"script"&#41;;
            b.src = "//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";
            document.body.appendChild&#40;b&#41;

            var c = document.createElement&#40;"script"&#41;;
            c.src = "//ads.themoneytizer.com/s/gen.js?type=Y";
            document.body.appendChild&#40;c&#41;

            var d = document.createElement&#40;"script"&#41;;
            d.src = "//ads.themoneytizer.com/s/requestform.js?siteId=XXXXXX&formatId=X";
            document.body.appendChild&#40;d&#41;
        &#125;;
        if &#40;window.addEventListener&#41; &#123;
          window.addEventListener&#40;"load", downloadJSAtOnload, false&#41;
      &#125; else &#123;
          if &#40;window.attachEvent&#41; &#123;
              window.attachEvent&#40;"onload", downloadJSAtOnload&#41;
          &#125; else &#123;
              window.onload = downloadJSAtOnload
          &#125;
        &#125;;
    </script> 

supervisior
PostRank 8
PostRank 8
Beiträge: 967
Registriert: 26.06.2006, 09:11

Beitrag von supervisior » 04.02.2019, 19:38

Na so wirklich verstanden hast Du es aber nicht?! Nur weil Du Dir selbst was zusammengebastelt hast, kannst Du daraus nicht schlussfolgern, dass es augenscheinlich funktionieren sollte.....!

Antworten
  • Vergleichbare Themen
    Antworten
    Zugriffe
    Letzter Beitrag