SharEDITor

教你成为全栈工程师(Full Stack Developer) 二十二-番外篇之网站开发不能放过的小细节

全栈技术 教你成为全栈工程师(Full Stack Developer) 发表于 2016-05-06 16:41:12 阅读892次


对之前开发的博客网站中一些小细节做一些补充,让他变得更完美,更像一个产品

请尊重原创,转载请注明来源网站www.shareditor.com以及原始链接地址

logo超链接

网站左上角的logo作为网站的一个标记,通常情况下点击会回到主页,刚好我们这部分是通过模板继承实现的,修改app/Resources/views/base.html.twig,找到logo文字的部分,加上超链接到主页,如下:

    <div class="col-sm-11 col-xs-11"><h1><a href="{{ path('homepage') }}" style="text-decoration: none;color: white;">MyWebSite</a></h1></div>

 

版权说明

 

每一个网站底部都会有一个版权说明以及备案文字,这个是我们天朝特殊要求的,如果没有在网站底部写明备案号,你的网站发布以后会在几天之内被封掉,所以还是修改app/Resources/views/base.html.twig,在</body>前增加以下内容

 

<div class="row navbar navbar-inverse" style="margin-bottom: 0;">
    <div class="row">
        <div class="col-sm-12 col-xs-12 text-center" style="color: #959595;margin-bottom: 10px;">
            Copyright © <a href="{{ path('homepage') }}">MyWebSite.com</a> | 京ICP备*****号
        </div>
    </div>
</div>

 

效果如下:

 

自定义标题

 

点开每一个网页的标题(浏览器tab页上的文字标题)应该是不同的,模板里面已经有了

<title>{% block title %}自定义标题{% endblock title %}</title>

来为我们扩展用

 

改变首页的标题,修改app/Resources/views/default/index.html.twig,在{% extends "base.html.twig" %}下增加:

{% block title %}MyWebSite - 我的网站{% endblock title %}

同样分别在app/Resources/views/blog/list.html.twig和app/Resources/views/blog/show.html.twig中也增加如下两条:

{% block title %}{{ subject.name }} - MyWebSite - 我的网站{% endblock title %}

{% block title %}{{ blogpost.title }} - SharEDITor - 关注大数据技术{% endblock title %}

请尊重原创,转载请注明来源网站www.shareditor.com以及原始链接地址

因为在BlogController的listAction中没有传递subject变量,所以还需要增加这个变量的传递,修改src/AppBundle/Controller/BlogController.php的listAction方法,增加:

        $this->subjectRepository = $this->getDoctrine()->getRepository('AppBundle:Subject');
        $subject = $this->subjectRepository->find($subjectId);

来获取$subject,然后把render语句改成:

        return $this->render('blog/list.html.twig', array('pagination' => $pagination,'subject' => $subject));

 

管理后台本地化

 

管理后台的一些显示文字不是很友好,比如按钮上的文字都是btn_create_and_****,这就需要我们做本地化的处理,本地化的意思就是本土化,也就是编程我们国家的语言,但是因为symfony2对中文支持不是很好,我们直接开启英文配置,修改app/config/config.yml,把

   #translator:      { fallbacks: ["%locale%"] }

前面的注释符号"#"去掉即可,按钮会变成:Create、Create and return list等

 

增加文章数目展示

首页里的类别展示中如果能展示出这一类里已经有了多少篇文章,会让用户体验更好,修改app/Resources/views/default/index.html.twig,修改显示类别名称一行为:

                <h3>{{ subject.name }}({{ blogcounts[subject.id] }})</h3>

这里的blogcounts在DefaultController.php的indexAction中没有传递,因此修改src/AppBundle/Controller/DefaultController.php,为DefaultController类增加如下方法:

    public function getSubjectBlogCountMap($subjects)
    {
        $this->blogPostRepository = $this->getDoctrine()->getRepository('AppBundle:BlogPost');
        $map = array();
        for ($i = 0; $i < sizeof($subjects); $i = $i + 1)
        {
            $this->subject = $subjects[$i];
            $map[$this->subject->getId()] = sizeof($this->blogPostRepository->findBy(array('subject' => $this->subject->getId())));
        }
        return $map;
    }

并把indexAction方法的render语句改成:

        return $this->render('default/index.html.twig', array(
            'subjects' => $subjects,
            'blogcounts' => $this->getSubjectBlogCountMap($subjects),
        ));