0

Typo3 Neos で Web サイトのサイト テンプレートを作成しました。ただし、テンプレートでは、JavaScript ファイルの前に CSS ファイルを含める必要があるため、JavaScript の順序を定義する必要があります。私は今これらのファイルを持っています:

Default.html:

{namespace neos=TYPO3\Neos\ViewHelpers}
{namespace ts=TYPO3\TypoScript\ViewHelpers}
<!DOCTYPE html>
<html lang="en">
<head>
    <f:section name="meta">
          <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <meta name="description" content="">
        <meta name="author" content="">
    </f:section>

    <f:section name="stylesheets">
        <!-- Bootstrap CSS -->
        <link href="{f:uri.resource(path: 'css/bootstrap.css', package: 'MyApp')}" rel="stylesheet">
        <link href="{f:uri.resource(path: 'css/responsive.css', package: 'MyApp')}" rel="stylesheet">

        <!-- Plugins -->
        <link href="{f:uri.resource(path: 'plugins/flexslider/flexslider.css', package: 'MyApp')}" rel="stylesheet">

        <!-- Theme style -->
        <link href="{f:uri.resource(path: 'css/theme-style.css', package: 'MyApp')}" rel="stylesheet">
    </f:section>

    <f:section name="headScripts">
        <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
        <script src="{f:uri.resource(path: 'js/html5.js', package: 'MyApp')}"></script>
        <![endif]-->

        <!--Retina.js plugin - @see: http://retinajs.com/-->
        <script src="{f:uri.resource(path: 'plugins/retina/retina.js', package: 'MyApp')}"></script> 
    </f:section>
</head>

そして Root.ts2:

page = Page {
head {

    meta = TYPO3.TypoScript:Template {
        templatePath = 'resource://MyApp/Private/Templates/Page/Default.html'
        sectionName = 'meta'
        title = ${q(node).property('title')}
    }

    stylesheets.site = TYPO3.TypoScript:Template {
        templatePath = 'resource://MyApp/Private/Templates/Page/Default.html'
        sectionName = 'stylesheets'
    }

    javascripts.site = TYPO3.TypoScript:Template {
        templatePath = 'resource://MyApp/Private/Templates/Page/Default.html'
        sectionName = 'headScripts'
    }
}

body {
    templatePath = 'resource://MyApp/Private/Templates/Page/Default.html'
    sectionName = 'body'
    parts {
        menu = Menu
        breadcrumb = Breadcrumb
    }
    // These are your content areas, you can define as many as you want, just name them and the nodePath.
    content {
        // The default content section
        main = PrimaryContent {
            nodePath = 'main'
        }
    }

    javascripts.site = TYPO3.TypoScript:Template {
        templatePath = 'resource://MyApp/Private/Templates/Page/Default.html'
        sectionName = 'bodyScripts'
    }
}
}

HTML の結果は次のとおりです。

<!DOCTYPE html><html><!--
	This website is powered by TYPO3 Neos, the next generation CMS, a free Open
	Source Enterprise Content Management System licensed under the GNU/GPL.

	TYPO3 Neos is based on Flow, a powerful PHP application framework licensed under the GNU/LGPL.

	More information and contribution opportunities at http://neos.typo3.org and http://flow.typo3.org
--><head>
        <meta charset="UTF-8" />
        <title>Home</title>
    
        <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
        <script src="http://app.local/_Resources/Static/Packages/MyApp/js/html5.js"></script>
        <![endif]-->

        <!--Retina.js plugin - @see: http://retinajs.com/-->
        <script src="http://app.local/_Resources/Static/Packages/MyApp/plugins/retina/retina.js"></script>

        <!-- Bootstrap CSS -->
        <link href="http://app.local/_Resources/Static/Packages/MyApp/css/bootstrap.css" rel="stylesheet">
        <link href="http://app.local/_Resources/Static/Packages/MyApp/css/responsive.css" rel="stylesheet">

        <!-- Plugins -->
        <link href="http://app.local/_Resources/Static/Packages/MyApp/plugins/flexslider/flexslider.css" rel="stylesheet">

        <!-- Theme style -->
        <link href="http://app.local/_Resources/Static/Packages/MyApp/css/theme-style.css" rel="stylesheet">

 

        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <meta name="description" content="">
        <meta name="author" content="">
    

    </head><body>

ただし、メタ情報を先頭に、次にスタイルシート、最後に JavaScript ファイルを含める必要があります。レンダリングされる要素の順序を定義することは可能ですか? Default.html の順序が使用されることを期待しますが、そうではないようです。

4

1 に答える 1

1

タイポ スクリプトには @position があり、順序を変更するために使用できます。動作を確認するには、 を確認してくださいTYPO3.Neos/Resources/Private/TypoScript/Prototypes/Page.ts2。あなたの場合、それはうまくいくはずです:

meta.@position = 'start 5'
stylesheets.@position = 'start 10'
javascripts.@position = 'start 15'

または、定義に直接入れることができます:

meta = TYPO3.TypoScript:Template {
    @position = 'start 5'

sth like'after headTag'またはを使用することもできます'before stylesheets'

TypoScriptについて - TypoScript 2 Pocket Referenceはチェックする価値があります:)

于 2014-12-17T14:06:08.443 に答える