Symfony2 - SonataUserBundle - 用户配置文件仪表板

Symfony2 - SonataUserBundle - user profile dashboard

如何让用户个人资料部分看起来像下面这样?

https://github.com/sonata-project/SonataUserBundle/blob/master/Resources/doc/reference/user_dashboard.rst

我目前的个人资料页面看起来很难看.. 我是否需要重写所有 *.html 文件,或者 Sonata 已经像 SonataAdminBundle 中那样实现了这种布局,我需要更改一些配置吗?

我正在使用: SonataUserBundle 与 FOSUserBundle、SonataAdminBundle

正如@lxer 所说,css/twig 扩展布局存在一些问题,因为文件 sonata-project\user-bundle\Resources\biews\Profile\action.html.twig 呈现如下:

                    <div class="row-fluid clearfix">

    </div>

<h2>Dashboard</h2>

<div class="sonata-user-show row row-fluid">

    <div class="span2 col-lg-2" style="padding: 8px 0;">
                    <div id="cms-block-555ed9f4923a2" class="cms-block cms-block-element">
                    <div class="list-group">
                                                <a href="/sf2/product/web/app_dev.php/profile/" class="list-group-item active ">Dashboard</a>                    

                                    <a href="/sf2/product/web/app_dev.php/profile/edit-profile" class="list-group-item">Profile</a>                    

                                    <a href="/sf2/product/web/app_dev.php/profile/edit-authentication" class="list-group-item ">Authentication</a>                    


        </div>

</div>

            </div>

    <div class="span10 col-lg-10">

            <div class='alert alert-default alert-info'>
    <strong>This is the user profile template. Feel free to override it.</strong>
    <div>This file can be found in <code>SonataUserBundle:Profile:show.html.twig</code>.</div>
</div>
    <div class="row row-fluid">

        <div class="span6 col-lg-6">
                                                <div id="cms-block-555ed9f493295" class="cms-block cms-block-element">
        <h2>Welcome!</h2> This is a sample user profile dashboard, feel free to override it in the configuration! Want to make this text dynamic? For instance display the user's name? Create a dedicated block and edit the configuration!
</div>

                                    </div>


        <div class="span6 col-lg-6">
                                                </div>
    </div>
    </div>

</div>

所以缺少部分代码...为什么它不扩展任何内容? 这是原始文件

{#

This file is part of the Sonata package.

(c) Thomas Rabaix <thomas.rabaix@sonata-project.org>

For the full copyright and license information, please view the LICENSE
file that was distributed with this source code.

#}

{% block sonata_page_breadcrumb %}
    {% if breadcrumb_context is not defined %}
        {% set breadcrumb_context = 'user_index' %}
    {% endif %}
    <div class="row-fluid clearfix">
        {{ sonata_block_render_event('breadcrumb', { 'context': breadcrumb_context, 'current_uri': app.request.requestUri }) }}
    </div>
{% endblock %}

<h2>{% block sonata_profile_title %}{% trans from 'SonataUserBundle' %}sonata_profile_title{% endtrans %}{% endblock %}</h2>

<div class="sonata-user-show row row-fluid">

    <div class="span2 col-lg-2" style="padding: 8px 0;">
        {% block sonata_profile_menu %}
            {{ sonata_block_render({'type': 'sonata.user.block.menu'}, {'current_uri': app.request.requestUri}) }}
        {% endblock %}
    </div>

    <div class="span10 col-lg-10">
        {% include 'SonataCoreBundle:FlashMessage:render.html.twig' %}

        {% block sonata_profile_content '' %}
    </div>

</div>

您忘记包含 CSS 文件, 或者他们出于某种原因 404(可能是错误的路径)。

我有同样的问题。我按照安装说明进行操作,但没有人说明如何连接 built-in 样式。它需要 MopaBootstrapBundle。大家在设置的时候应该已经注意到了没有安装的错误。使用生成的 ApplicationSonataUserBundle 添加样式表。这对初学者来说是重要的信息。看到个人账号的样子我就懵了。您必须从

复制模板
vendor/sonata-project/user-bundle/Resources/views

并将其粘贴到

src/Application/Sonata/UserBundle/Resources/views

那你就可以去探索了。我必须说他们在逻辑上有问题。例如,在 change_password 页面上复制 header,当它嵌入到 auth 页面时。

使用 bootstrap CDN 进行快速安装

{%block stylesheets%}
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">

    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">

    <!-- Latest compiled and minified JavaScript -->
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
{%endblock%}

将其粘贴到您的

src/Application/Sonata/UserBundle/Resources/views/layout.html.twig 
src/Application/Sonata/UserBundle/Resources/views/Profile/action.html.twig

希望对您有所帮助!对不起 Google 翻译,欢迎编辑。