问题描述
无论我尝试什么,都无法让 Felogin 插件看起来像(引导)其他表单元素。
我还尝试使用“功能切换”并将 Felogin: extbase 设置为启用。
顺便说一句,永久登录功能也不起作用。
我是 Typo3 的新手!请帮忙。
这是我对表单样式的看法:
这就是我想要的:
解决方法
首先您需要知道 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>