文章/答案/技术大牛

发布

社区首页 >问答首页 >TYPO3 felogin插件没有CSS

问TYPO3 felogin插件没有CSS
EN

Stack Overflow用户

提问于 2021-01-07 01:39:07

回答 1查看 132关注 0票数 0

无论我怎么尝试，都不能让Felogin插件看起来像(bootstrap)其他表单元素。

我还尝试使用"Feature Toggles“并将Felogin: extbase设置为Enable。

顺便说一句，Permalogin函数也不起作用。

我是Typo3的新手！请帮帮忙。

这是我对表单样式的看法：

这就是我想要的：

typo3

typo3-extensions

typo3-10.x

回答 1

Stack Overflow用户

发布于 2021-07-15 19:31:23

首先，您需要知道pibase和extbase/fluid的模板都位于EXT:felogin/Resources/Private/Templates/中。文件FrontendLogin.html仅适用于pibase，并包含所有视图。对于extabse/fluid，不同的视图有不同的文件，其中登录表单是EXT:felogin/Resources/Private/Templates/Login/Login.html，依此类推。

将Login/Login.html复制到您的自定义站点包。例如，typo3conf/ext/custom_sitepackage/Resources/Private/Templates/Login/Login.html。然后您应该通过TypoScript对其进行配置

plugin.tx_felogin_login {
    view {
        templateRootPaths.10 = EXT:custom_sitepackage/Resources/Private/Templates/Felogin
    }
}

根据你的需求调整你的Login/Login.html，f.x。对于TwitterBootstrap 4

<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">

<f:flashMessages />
<f:if condition="{cookieWarning}">
    <f:render partial="CookieWarning" />
</f:if>
<f:switch expression="{messageKey}">
    <f:case value="welcome"><f:variable name="alertKey" value="info" /></f:case>
    <f:case value="error"><f:variable name="alertKey" value="danger" /></f:case>
    <f:defaultCase><f:variable name="alertKey" value="info" /></f:defaultCase>
</f:switch>
<f:if condition="{messageKey}">
    <div class="alert alert-{alertKey}" role="alert">
        <h3>
            <f:render partial="RenderLabelOrMessage" arguments="{key: '{messageKey}_header'}" />
        </h3>
        <p>
            <f:render partial="RenderLabelOrMessage" arguments="{key: '{messageKey}_message'}" />
        </p>
    </div>
</f:if>
<f:if condition="{onSubmit}">
    <f:then>
        <f:form target="_top" fieldNamePrefix="" action="login" onsubmit="{onSubmit}">
            <f:render section="content" arguments="{_all}" />
        </f:form>
    </f:then>
    <f:else>
        <f:form target="_top" fieldNamePrefix="" action="login">
            <f:render section="content" arguments="{_all}" />
        </f:form>
    </f:else>
</f:if>

<f:if condition="{settings.showForgotPassword}">
    <f:link.action action="recovery" controller="PasswordRecovery">
        <f:render partial="RenderLabelOrMessage" arguments="{key: 'forgot_header'}" />
    </f:link.action>
</f:if>

<f:section name="content">
    <fieldset>
        <legend>
            <f:translate key="login" />
        </legend>
        <div class="form-group row">
            <label class="col-12 col-sm-3 col-md-2 col-form-label">
                <f:translate key="username" />
            </label>
            <div class="col-12 col-sm-9 col-md-10">
                <f:form.textfield name="user" class="form-control" />
            </div>
        </div>
        <div class="form-group row">
            <label class="col-12 col-sm-3 col-md-2 col-form-label">
                <f:translate key="password" />
            </label>
            <div class="col-12 col-sm-9 col-md-10">
                <f:form.password name="pass" data="{rsa-encryption: ''}" class="form-control" />
            </div>
        </div>
        <f:if condition="{permaloginStatus} > -1">
            <div class="form-group row">
                <div class="col-12 col-sm-3 col-md-2 col-form-label"></div>
                <div class="col-12 col-sm-9 col-md-10">
                    <div class="custom-control custom-checkbox">
                        <f:if condition="{permaloginStatus} == 1">
                            <f:then>
                                <f:form.hidden name="permalogin" value="0" additionalAttributes="{disabled: 'disabled'}" />
                                <f:form.checkbox name="permalogin" id="permalogin" value="1" checked="checked" class="custom-control-input" />
                            </f:then>
                            <f:else>
                                <f:form.hidden name="permalogin" value="0" />
                                <f:form.checkbox name="permalogin" id="permalogin" value="1" class="custom-control-input" />
                            </f:else>
                        </f:if>
                        <label for="permalogin" class="custom-control-label">
                            <f:translate id="permalogin" />
                        </label>
                    </div>
                </div>
            </div>
        </f:if>
        <div class="row">
            <div class="col-12 col-sm-9 col-md-10 ml-auto">
                <f:form.submit value="{f:translate(key: 'login')}" name="submit" class="btn btn-primary" />
            </div>
        </div>
        <div class="felogin-hidden">
            <f:form.hidden name="logintype" value="login" />
            <f:form.hidden name="pid" value="{storagePid}" />
            <f:if condition="{redirectURL}!=''">
                <f:form.hidden name="redirect_url" value="{redirectURL}" />
            </f:if>
            <f:if condition="{referer}!=''">
                <f:form.hidden name="referer" value="{referer}" />
            </f:if>
            <f:if condition="{redirectReferrer}!=''">
                <f:form.hidden name="redirectReferrer" value="off" />
            </f:if>
            <f:if condition="{noRedirect}!=''">
                <f:form.hidden name="noredirect" value="1" />
            </f:if>
            {extraHidden}
        </div>
    </fieldset>
</f:section>

</html>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/65600699

复制

相似问题

问TYPO3 felogin插件没有CSS
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问TYPO3 felogin插件没有CSSEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问TYPO3 felogin插件没有CSS
EN