it-swarm.com.de

Der beste Weg, um CSS / JS-Dateien in meine benutzerdefinierte Erweiterung aufzunehmen

Wenn ich CSS- oder JS-Dateien in meine benutzerdefinierten Erweiterungen aufnehmen muss, was ist der beste und sicherste Weg, um dies zu erreichen:

  1. Soll ich sie in einem bestimmten Ordner in meiner ZIP-Datei ablegen?
  2. Wie soll ich die Dateien in meinem XML-Manifest deklarieren?
  3. Wie füge ich die Dateien in den Joomla-Header ein (nur bei Bedarf)?
8
Bogowoe

Der beste Weg wäre, den Medienordner zu verwenden. Sie müssen also zunächst einen Ordner mit dem Namen media in Ihrem Modulordner erstellen.

Hinweis: Dieser Ordner sollte vor der Installation erstellt werden, nicht danach.

Erstellen Sie im Medienordner zwei Unterordner, css und js. Dies ist nicht erforderlich, aber es ist nur besser, die Dinge getrennt zu halten.

Fügen Sie Ihrer XML-Datei dann Folgendes hinzu:

<media folder="media" destination="mod_EXAMPLE">
    <folder>css</folder>
    <folder>js</folder>
</media>

Veränderung mod_EXAMPLE zu was auch immer Ihr Modul ist.

Bei der Installation wird der Medienordner automatisch verschoben und Sie erhalten Folgendes:

JOOMLA_ROOT/media/mod_EXAMPLE/js

und

JOOMLA_ROOT/media/mod_EXAMPLE/css

Ich weiß, dass ich mich bisher auf ein Modul bezogen habe, aber das Gleiche gilt auch für Komponenten.

Um die Datei aufzurufen, können Sie Ihrer default.php-Datei für Ihre Erweiterung den folgenden Code hinzufügen:

JHtml::_('stylesheet', JUri::root() . 'media/mod_EXAMPLE/css/style.css');  // For CSS files
JHtml::_('script', JUri::root() . 'media/mod_EXAMPLE/js/script.js');       // For JS files

Hoffe das hilft

7
Lodder
  1. Ich gehe davon aus, dass Ihre Erweiterung eine Komponente ist. Am besten erstellen Sie ein media -Verzeichnis neben admin und site -Verzeichnissen. Legen Sie dann js-, css- und img -Dateien in getrennten Verzeichnissen wie folgt ab:

    index.html
    YOUR_COMPONENT_NAME.xml
    [+] admin
    [+] site
    [-] media
       [-] js
          main.js
          index.html
       [+] css
       [+] img
    

    Beachten Sie, dass jeder Ordner eine leere index.html - Datei enthalten sollte.

  2. In Ihrem XML-Manifest (YOUR_COMPONENT_NAME.xml) können Sie media wie folgt deklarieren:

    <media destination="com_YOUR_COMPONENT_NAME" folder="media">
        <filename>index.html</filename>
        <folder>css</folder>
        <folder>js</folder>
        <folder>img</folder>
    </media>
    
  3. Bearbeiten Sie die Standardansicht (default.php) und fügen Sie diese Zeilen hinzu, um die Dateien in Joomla! Kopf:

    $document = JFactory::getDocument();
    $document->addStyleSheet(JUri::base() . 'media/com_YOUR_COMPONENT_NAME/css/main.css');
    $document->addScript(JUri::base() . 'media/com_YOUR_COMPONENT_NAME/js/main.js');
    $test_image_url = JUri::base() . 'media/com_YOUR_COMPONENT_NAME/img/test.jpg';
    
2
Farahmand