# Script einfügen

**URL:** <https://forum.shopware.com/t/script-einfuegen/88221>\
**Category:** Shopware 5\
**Created:** [9. Juni 2021 um 11:52 UTC](https://forum.shopware.com/t/script-einfuegen/88221 "2021-06-09T11:52:08Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Shinebright](https://avatars.discourse-cdn.com/v4/letter/s/a9adbd/32.png) [@Shinebright](https://forum.shopware.com/u/Shinebright)\
**Post date:** [9. Juni 2021 um 11:52 UTC](https://forum.shopware.com/t/script-einfuegen/88221/1 "2021-06-09T11:52:08Z")

</div>

Hallo,  
ich würde gerne ein Script einfügen, das eine zusätzliche Klasse einen Element beim Scrollen hinzufügt.  
Ich bin nicht der Javascriptexperte, habe aber ein Script gefunden und an meine Klassen bzw. ID’s angepasst.  
Eingebunden habe ich es in meiner header.tpl, dafür habe ich den Block für das Tracking genutzt:

```auto
{extends file='parent:frontend/index/header.tpl'}

{* Block for tracking codes which are required to include in the `head` section of the document *}
{block name="frontend_index_header_javascript_tracking"}

<script>
{literal}
window.onscroll = function() {myFunction()};

var headertop = document.getElementById("topbar");
var sticky = headertop.offsetTop;

function myFunction() {
  if (window.pageYOffset > sticky) {
    headertop.classList.add("sticky");
  } else {
    headertop.classList.remove("sticky");
  }
}
{/literal}
</script>

{/block}

```

Folgendes Element soll damit angesprochen werden:

```auto
<div id="topbar" class="headertop">

```

In der Demo des Scripts funktioniert das wunderbar.

Leider funktioniert es im Shop nicht, die Klasse headertop wird beim Scrollen nicht um die Klasse sticky erweitert.  
Die literal-Tags habe ich testweise vor und nach den script-Tags gesetzt.

Habe ich irgendwo einen Fehler?  
Oder kann ich das anders lösen?

Gruß Michael

---

<div class="post-metadata">

**Author:** ![phil](https://dub1.discourse-cdn.com/flex013/user_avatar/forum.shopware.com/phil/32/13661_2.png) [@phil](https://forum.shopware.com/u/phil)\
**Post date:** [9. Juni 2021 um 20:59 UTC](https://forum.shopware.com/t/script-einfuegen/88221/2 "2021-06-09T20:59:02Z")

</div>

Hi Michael,

um ein eigenes Javascript einzubinden, erstellst du eine Datei mit dem Quelltext des Scripts in deinem Custom Theme im Verzeichnis \_public/src/js und verweist dann in der Theme.php auf diese. Näheres siehe [https://developers.shopware.com/designers-guide/css-and-js-files-usage/](https://developers.shopware.com/designers-guide/css-and-js-files-usage/).

Danach Theme im Backend neu kompilieren (findest du unter Cache löschen) und schon ist dein Script mit eingebunden.

LG Phil
