任务44：前台模板分离
1，\resources\views\Index\Article\index.blade.php 模板名称改为 article.blade.php 并编辑代码如下
<html lang="zh-CN" class=" js flexbox canvas canvastext webgl no-touch geolocation postmessage websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="HandheldFriendly" content="true"> <link rel="profile" href="http://gmpg.org/xfn/11"> <title>拉丁美洲的春季 秘鲁探秘的最佳时节 – 大牛课堂</title> <meta name="robots" content="noindex,follow"> <link rel="dns-prefetch" href="//s.w.org"> <link rel="stylesheet" id="wp-block-library-css" href="{{asset('static')}}/index/css/style.min.css?ver=5.2.3" type="text/css" media="all"> <link rel="stylesheet" id="zimeiti-2-style-css" href="{{asset('static')}}/index/css/style.css?ver=20200113" type="text/css" media="all"> <link rel="stylesheet" id="genericons-style-css" href="{{asset('static')}}/index/css/genericons.css?ver=5.2.3" type="text/css" media="all"> <link rel="stylesheet" id="zimeiti-2-responsive-style-css" href="{{asset('static')}}/index/css/responsive.css?ver=20200113" type="text/css" media="all"> <script src="https://hm.baidu.com/hm.js?adffbbfa4c220a656094574941c145dc"></script><script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-includes/js/jquery/jquery.js?ver=1.12.4-wp"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1"></script> <script type="text/javascript"> /* <![CDATA[ */ var simpleLikes = {"ajaxurl":"https:\/\/www.zhutibaba.com\/demo\/zimeiti2\/wp-admin\/admin-ajax.php","like":"\u70b9\u8d5e\u8fd9\u7bc7\u6587\u7ae0","unlike":"\u53d6\u6d88\u70b9\u8d5e"}; /* ]]> */ </script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/js/simple-likes-public.js?ver=0.5"></script> <link rel="https://api.w.org/" href="https://www.zhutibaba.com/demo/zimeiti2/wp-json/"> <link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://www.zhutibaba.com/demo/zimeiti2/xmlrpc.php?rsd"> <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://www.zhutibaba.com/demo/zimeiti2/wp-includes/wlwmanifest.xml"> <link rel="prev" title="在WordPress网站写的第一篇文章" href="https://www.zhutibaba.com/demo/zimeiti2/292.html"> <link rel="next" title="海拔3800米的越野天堂" href="https://www.zhutibaba.com/demo/zimeiti2/90.html"> <link rel="canonical" href="https://www.zhutibaba.com/demo/zimeiti2/87.html"> <link rel="shortlink" href="https://www.zhutibaba.com/demo/zimeiti2/?p=87"> <link rel="alternate" type="application/json+oembed" href="https://www.zhutibaba.com/demo/zimeiti2/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.zhutibaba.com%2Fdemo%2Fzimeiti2%2F87.html"> <link rel="alternate" type="text/xml+oembed" href="https://www.zhutibaba.com/demo/zimeiti2/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.zhutibaba.com%2Fdemo%2Fzimeiti2%2F87.html&format=xml"> <link rel="pingback" href="https://www.zhutibaba.com/demo/zimeiti2/xmlrpc.php"> <style type="text/css" id="wp-custom-css"> .bx-wrapper .bx-controls-direction a, .bx-wrapper .bx-pager { z-index: 90; } </style> <style type="text/css"> /* Theme Colors */ /* Primary Color */ a:hover, .sf-menu li.sfHover li a:hover, .sidebar .widget a:hover, .site-footer .widget a:hover, .author-box a:hover, .page-content a:hover, .entry-content a:hover, article.hentry .edit-link a:hover, .comment-content a:hover, .entry-meta a:hover, .entry-title a:hover, .content-list .entry-title a:hover, .pagination .page-numbers:hover, .pagination .page-numbers.current, #site-bottom a:hover, .tab-titles li.active a, .entry-category a:after, .author-box .author-meta .author-name a:hover, #featured-grid h2.section-title span { color: #ff4c4c; } h2.section-title .title, .breadcrumbs h1 span.title, .tab-titles li.active a, .pagination .page-numbers:hover, .pagination .page-numbers.current, .sidebar .widget .widget-title span, #featured-grid h2.section-title span { border-bottom-color: #ff4c4c; } button, .btn, input[type="submit"], input[type="reset"], input[type="button"], .sf-menu li a:hover, .sf-menu li.sfHover a, .entry-category a, .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus { background-color: #ff4c4c; } @media only screen and (max-width: 767px) { #primary-nav { background-color: #ff4c4c; } } /* Secondary Color */ .site-header .search-icon:hover span, .site-header .search-icon:hover span:before, article.hentry .edit-link a, .author-box a, .page-content a, .entry-content a, .comment-author a, .comment-content a, .comment-reply-title small a:hover, .sidebar .widget a, .site-footer .widget a { color: #037ef3; } /* Tertiary Color */ #featured-grid .entry-like a.liked, h2.section-title .posts-counter strong, .popular-content .entry-meta .entry-like a.liked, .content-list .entry-meta.second-line .entry-like a.liked, .related-content .entry-meta .entry-like a.liked, .entry-tags .tag-links a, .widget_tag_cloud .tagcloud a { color: #76b852 !important; } .single #primary .entry-footer .entry-like a { background-color: #76b852; } .entry-tags .tag-links a, .widget_tag_cloud .tagcloud a { border-color: #76b852 !important; } </style> </head> <body class="post-template-default single single-post postid-87 single-format-standard wp-custom-logo"> <div id="page" class="site"> <div id="content" class="site-content container clear"> <div class="left-col sidebar-2"> <div class="site-branding"> <div id="logo"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" class="custom-logo-link" rel="home"><img width="240" height="120" src="{{asset('static')}}/index/imgs/logo.png" class="custom-logo" alt="自媒体二号"></a> </div><!-- #logo --> </div><!-- .site-branding --> <nav id="primary-nav" class="primary-navigation phone_menu_col_4"> <div class="menu-primary-container"><ul id="primary-menu" class="sf-menu sf-js-enabled sf-arrows" style="touch-action: pan-y;"> <li id="menu-item-492" class="color1 menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-492"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" aria-current="page">旅游攻略</a> </li> <li id="menu-item-492" class="color1 menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-492"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" aria-current="page">教育公益</a> </li> <li id="menu-item-492" class="color1 menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-492"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" aria-current="page">财经股票</a> </li> <li id="menu-item-492" class="color1 menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-492"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" aria-current="page">大牛课堂</a> </li> </ul></div> </nav><!-- #primary-nav --> <!--<div id="slick-mobile-menu"></div>--> <span class="search-icon"> <span class="genericon genericon-search"> <span>搜索</span></span> <span class="genericon genericon-close"> <span>收起</span></span> </span> <div class="header-search"> <form id="searchform" method="get" action="https://www.zhutibaba.com/demo/zimeiti2/"> <input type="search" name="s" class="search-input" placeholder="请输入关键词" autocomplete="off"> <button type="submit" class="search-submit">搜索</button> </form> </div><!-- .header-search --> </div><!-- .left-col --> <div id="primary" class="content-area"> <div class="content-wrapper"> <main id="main" class="site-main"> <article id="post-87" class="post-87 post type-post status-publish format-standard has-post-thumbnail hentry category-sports category-sub-1 category-sub-3 category-sub-2 category-house category-edu category-news category-travel category-auto category-tech category-food category-finance tag-25 tag-26 tag-27"> <div class="single-breadcrumbs"> <span>您的位置</span> <i class="fa fa-angle-right"></i> <a href="https://www.zhutibaba.com/demo/zimeiti2">首页</a> <i class="fa fa-angle-right"></i> <a href="https://www.zhutibaba.com/demo/zimeiti2/category/sports ">体育视界</a> </div> <header class="entry-header"> <h1 class="entry-title">拉丁美洲的春季 秘鲁探秘的最佳时节</h1> <div class="entry-meta"> <span class="entry-date"> 发布于 2018-06-06 </span><!-- .entry-date --> <span class="entry-comment"><a href="https://www.zhutibaba.com/demo/zimeiti2/87.html#comments" class="comments-link">评论(3)</a></span> <span class="entry-views">阅读<span class="view-count">(783)</span> </span> </div><!-- .entry-meta --> </header><!-- .entry-header --> <div class="entry-content"> <img width="480" height="235" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/23.png" class="attachment-zimeiti_2_single_thumb size-zimeiti_2_single_thumb wp-post-image" alt="" srcset="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/23.png 480w, https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/23-300x147.png 300w" sizes="(max-width: 480px) 100vw, 480px"> <p>从标志性的马丘比丘和圣谷到风景如画的喀喀湖和科尔卡大峡谷，神秘秘鲁在拉丁美洲独具一格，也吸引着越来越多的中国游客前往。即将到来的十月是秘鲁迷人的春季，我们来盘点一下秘鲁春季有哪些地方在等待我们解密。</p> <p>无论你是经验丰富的探险家，又或是度假新手小白，选择十月份来秘鲁都是你参观秘鲁南部景色的最佳时节。 干燥的冬季即将结束，夏季又会持续数月降雨，所以春季，干爽舒服的天气为你游览秘鲁圣谷提供了完美的时机。 穿过历史悠久的山谷，那里仍然可以看到古老的印加农耕梯田盘旋在山麓丘陵上，印加王室的遗址俯瞰着这个有争议的山谷。 1573年，就是在这个圣谷，国王Manco Inca宣布战胜了赫尔南多皮萨罗和西班牙侵略者。</p> <p>印加帝国保存最完好的标志性地标有：马丘比丘，太阳神庙，三窗庙以及拴日石——古代时钟或者天文历。 这座高耸入云的城堡是西班牙征服者未曾发现的少数遗址之一，这也使它完美地向世人展示了古代印加人的生活，神秘且沧桑。</p> <p>库斯科是一座即历史悠久又充满现代感的城市，已然发展成了秘鲁的国际大都会，融合了印加文明和西班牙文化。 参观西班牙殖民时期的建筑瑰宝，例如武器广场和莫瑞古印加圆形梯田——这是一个不寻常的印加考古遗址，降落在地面上的梯田。在库斯科附近千万不要错过令人惊艳的Vinicunca彩虹山， 山上的矿藏将景观变幻为褐红色、粉蓝色和亮黄色，强烈的视觉冲击，颇受摄影师的青睐。</p> <p>再往南，就是阿雷基帕市，米斯蒂火山耸立在它的上方。 Basilica大教堂矗立在阿雷基帕市中心，诉说着历史殖民的印记以及现在天主教的感召力。 从红色赭石到天蓝色的鲜艳彩绘墙壁，见证着圣卡塔利娜修道院令人惊叹的色彩和宁静。</p> <p>令人叹为观止的科尔卡大峡谷位于阿雷基帕西北部，这里是著名的“永恒之鸟”或安第斯雄鹰的故乡，雄鹰寿命长达70年，翼展可达到2.7米。 仔细观察，你可能会看到这些雄鹰会沿着峡谷的高处俯瞰，或者在温泉边享受惬意。也许没有哪个地方比Chivay小镇更适合观赏大峡谷的缤纷壮丽，Chivay小镇以壮观的印加大桥（Inca Bridge）而闻名，这座大桥是横跨在高山之间的一条1900英尺高的小径。</p> <p>最后，向东行至普诺市，拥有壮丽的喀喀湖——是秘鲁和玻利维亚之间高海拔的湖泊，大型蛇形芦苇船停泊在湖岸。在多姿多彩的节日里，你可以欣赏到传统的仪式活动以及色彩艳丽的服饰和面具。在喀喀湖的中央有一座美丽的私人岛屿，生长着多种植物和众多野生动物。最令人难忘的是，在这里可以自由地呼吸那纯净的空气，享受难得的宁静。</p> </div><!-- .entry-content --> <div class="entry-footer clear"> <div class="entry-tags"> <span class="tag-links"><span>标签:</span> <a href="https://www.zhutibaba.com/demo/zimeiti2/tag/%e6%a0%87%e7%ad%be1" rel="tag">标签1</a> <a href="https://www.zhutibaba.com/demo/zimeiti2/tag/%e6%a0%87%e7%ad%be2" rel="tag">标签2</a> <a href="https://www.zhutibaba.com/demo/zimeiti2/tag/%e6%a0%87%e7%ad%be3" rel="tag">标签3</a></span> </div><!-- .entry-tags --> <!-- The Modal --> <div id="myModal" class="modal"> <!-- Modal content --> <div class="modal-content clear"> <h3>给这篇文章的作者打赏</h3> <div class="ht_grid_1_2_custom"> <img src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/img/weixin-code.png" alt="微信扫一扫打赏"> 微信扫一扫打赏 </div> <div class="ht_grid_1_2_custom"> <img src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/img/alipay-code.png" alt="微信扫一扫打赏"> 支付宝扫一扫打赏 </div> <span class="close">×</span> </div> </div> <div class="entry-footer-right"> <span class="entry-sponsor"> <span id="myBtn" href="#"><i class="fa fa-jpy"></i> 打赏</span> </span> <span class="entry-like"> <span class="sl-wrapper"><a href="https://www.zhutibaba.com/demo/zimeiti2/wp-admin/admin-ajax.php?action=process_simple_like&post_id=87&nonce=178f7d1a83&is_comment=0&disabled=true" class="sl-button sl-button-87" data-nonce="178f7d1a83" data-post-id="87" data-iscomment="0" title="点赞这篇文章"><span class="sl-count"><i class="fa fa-thumbs-o-up"></i> 点赞(79)</span></a><span class="sl-loader"></span></span> </span><!-- .entry-like --> </div> </div><!-- .entry-footer --> </article><!-- #post-## --> <!-- .author-box --> <!-- .related-content --> <div class="popular-content entry-related"> <h2 class="section-title">热门文章</h2> <div class="popular-loop"> <div class="hentry"> <h2 class="entry-title"><span class="post-num num-1">1</span><a href="https://www.zhutibaba.com/demo/zimeiti2/294.html">超美的三亚,5天4晚全五星酒店高大上自由行</a></h2> <div class="entry-meta"> <span class="entry-like"> <span class="sl-wrapper"><a href="https://www.zhutibaba.com/demo/zimeiti2/wp-admin/admin-ajax.php?action=process_simple_like&post_id=294&nonce=178f7d1a83&is_comment=0&disabled=true" class="sl-button sl-button-294" data-nonce="178f7d1a83" data-post-id="294" data-iscomment="0" title="点赞这篇文章"><span class="sl-count"><i class="fa fa-thumbs-o-up"></i> 点赞(171)</span></a><span class="sl-loader"></span></span> </span><!-- .entry-like --> <span class="entry-views">阅读<span class="view-count">(1,932)</span> </span> </div> </div><!-- .hentry --> <div class="hentry"> <h2 class="entry-title"><span class="post-num num-2">2</span><a href="https://www.zhutibaba.com/demo/zimeiti2/176.html">呼伦贝尔: 你不可错过的辽阔草原和兴安秋色!</a></h2> <div class="entry-meta"> <span class="entry-like"> <span class="sl-wrapper"><a href="https://www.zhutibaba.com/demo/zimeiti2/wp-admin/admin-ajax.php?action=process_simple_like&post_id=176&nonce=178f7d1a83&is_comment=0&disabled=true" class="sl-button sl-button-176" data-nonce="178f7d1a83" data-post-id="176" data-iscomment="0" title="点赞这篇文章"><span class="sl-count"><i class="fa fa-thumbs-o-up"></i> 点赞(159)</span></a><span class="sl-loader"></span></span> </span><!-- .entry-like --> <span class="entry-views">阅读<span class="view-count">(1,635)</span> </span> </div> </div><!-- .hentry --> <div class="hentry"> <h2 class="entry-title"><span class="post-num num-3">3</span><a href="https://www.zhutibaba.com/demo/zimeiti2/341.html">海关总署：已立即暂停采购和使用长春长生各类疫苗</a></h2> <div class="entry-meta"> <span class="entry-like"> <span class="sl-wrapper"><a href="https://www.zhutibaba.com/demo/zimeiti2/wp-admin/admin-ajax.php?action=process_simple_like&post_id=341&nonce=178f7d1a83&is_comment=0&disabled=true" class="sl-button sl-button-341" data-nonce="178f7d1a83" data-post-id="341" data-iscomment="0" title="点赞这篇文章"><span class="sl-count"><i class="fa fa-thumbs-o-up"></i> 点赞(96)</span></a><span class="sl-loader"></span></span> </span><!-- .entry-like --> <span class="entry-views">阅读<span class="view-count">(1,412)</span> </span> </div> </div><!-- .hentry --> <div class="hentry"> <h2 class="entry-title"><span class="post-num num-4">4</span><a href="https://www.zhutibaba.com/demo/zimeiti2/70.html">世界杯最大牌女球迷，一举动令人钦佩</a></h2> <div class="entry-meta"> <span class="entry-like"> <span class="sl-wrapper"><a href="https://www.zhutibaba.com/demo/zimeiti2/wp-admin/admin-ajax.php?action=process_simple_like&post_id=70&nonce=178f7d1a83&is_comment=0&disabled=true" class="sl-button sl-button-70" data-nonce="178f7d1a83" data-post-id="70" data-iscomment="0" title="点赞这篇文章"><span class="sl-count"><i class="fa fa-thumbs-o-up"></i> 点赞(134)</span></a><span class="sl-loader"></span></span> </span><!-- .entry-like --> <span class="entry-views">阅读<span class="view-count">(1,057)</span> </span> </div> </div><!-- .hentry --> <div class="hentry"> <h2 class="entry-title"><span class="post-num num-5">5</span><a href="https://www.zhutibaba.com/demo/zimeiti2/168.html">JEEP全新牧马人高清官图曝光,彰显与时俱进的新一代野性!</a></h2> <div class="entry-meta"> <span class="entry-like"> <span class="sl-wrapper"><a href="https://www.zhutibaba.com/demo/zimeiti2/wp-admin/admin-ajax.php?action=process_simple_like&post_id=168&nonce=178f7d1a83&is_comment=0&disabled=true" class="sl-button sl-button-168" data-nonce="178f7d1a83" data-post-id="168" data-iscomment="0" title="点赞这篇文章"><span class="sl-count"><i class="fa fa-thumbs-o-up"></i> 点赞(141)</span></a><span class="sl-loader"></span></span> </span><!-- .entry-like --> <span class="entry-views">阅读<span class="view-count">(1,024)</span> </span> </div> </div><!-- .hentry --> </div><!-- .popular-loop --> </div><!-- .popular-content --> <!-- #comments --> </main><!-- #main --> </div><!-- .content-wrapper --> </div><!-- #primary --> <aside id="secondary" class="widget-area sidebar"> <div id="search-2" class="widget widget_search"><form id="searchform" method="get" action="https://www.zhutibaba.com/demo/zimeiti2/"> <input type="search" name="s" class="search-input" placeholder="请输入关键词" autocomplete="off"> <button type="submit" class="search-submit">搜索</button> </form></div><div id="zimeiti_2-views-2" class="widget widget-zimeiti_2-views widget_posts_thumbnail"><h2 class="widget-title"><span>浏览最多的文章<span></span></span></h2><ul><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/294.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/g17-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/294.html" rel="bookmark">超美的三亚,5天4晚全五星酒店高大上自由行</a><div class="entry-meta">2018-07-27</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/176.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/g8-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/176.html" rel="bookmark">呼伦贝尔: 你不可错过的辽阔草原和兴安秋色!</a><div class="entry-meta">2018-08-03</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/341.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/b43-120x85.jpeg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/341.html" rel="bookmark">海关总署：已立即暂停采购和使用长春长生各类疫苗</a><div class="entry-meta">2018-07-25</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/70.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/18-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/70.html" rel="bookmark">世界杯最大牌女球迷，一举动令人钦佩</a><div class="entry-meta">2018-07-07</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/168.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/g1-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/168.html" rel="bookmark">JEEP全新牧马人高清官图曝光,彰显与时俱进的新一代野性!</a><div class="entry-meta">2018-07-30</div></div></li></ul></div><div id="zimeiti_2-popular-2" class="widget widget-zimeiti_2-popular widget_posts_thumbnail"><h2 class="widget-title"><span>评论最多的文章<span></span></span></h2><ul><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/87.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/23-120x85.png" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/87.html" rel="bookmark">拉丁美洲的春季 秘鲁探秘的最佳时节</a><div class="entry-meta">2018-06-06</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/70.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/18-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/70.html" rel="bookmark">世界杯最大牌女球迷，一举动令人钦佩</a><div class="entry-meta">2018-07-07</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/176.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/g8-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/176.html" rel="bookmark">呼伦贝尔: 你不可错过的辽阔草原和兴安秋色!</a><div class="entry-meta">2018-08-03</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/292.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/28-1-120x85.jpeg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/292.html" rel="bookmark">在WordPress网站写的第一篇文章</a><div class="entry-meta">2018-06-05</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/31.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/7-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/31.html" rel="bookmark">三江源头 这家自主车企如何传递品牌“温度”</a><div class="entry-meta">2018-07-06</div></div></li></ul></div></aside><!-- #secondary --> </div><!-- #content .site-content --> <!-- .container --> </div><!-- #page --> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?adffbbfa4c220a656094574941c145dc"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script><script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/js/superfish.js?ver=5.2.3"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/js/jquery.slicknav.js?ver=5.2.3"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/js/modernizr.js?ver=5.2.3"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/js/html5.js?ver=5.2.3"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/js/jquery.bxslider.js?ver=5.2.3"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/js/qrcode.js?ver=5.2.3"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/js/social-share.js?ver=5.2.3"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/themes/zimeiti-2/assets/js/jquery.custom.js?ver=20180615"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-includes/js/comment-reply.min.js?ver=5.2.3"></script> <script type="text/javascript" src="https://www.zhutibaba.com/demo/zimeiti2/wp-includes/js/wp-embed.min.js?ver=5.2.3"></script> <div id="back-top" style="display: none;"> <a href="#top" title="返回顶部"><span class="genericon genericon-collapse"></span></a> </div> <script> (function($){ //create closure so we can safely use $ as alias for jQuery $(document).ready(function(){ "use strict"; /*-----------------------------------------------------------------------------------*/ /* Slick Mobile Menu /*-----------------------------------------------------------------------------------*/ $('#primary-menu').slicknav({ prependTo: '#slick-mobile-menu', allowParentLinks: true, label: '导航' }); }); })(jQuery); </script> <script> // Get the modal var modal = document.getElementById('myModal'); // Get the button that opens the modal var btn = document.getElementById("myBtn"); // Get the <span> element that closes the modal var span = document.getElementsByClassName("close")[0]; // When the user clicks the button, open the modal btn.onclick = function() { modal.style.display = "block"; } // When the user clicks on <span> (x), close the modal span.onclick = function() { modal.style.display = "none"; } // When the user clicks anywhere outside of the modal, close it window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } } </script> <!-- WP Super Cache: 已禁用已知用户的缓存。 用户已登录或已找到cookie。 --> </body></html>
2，App\Http\Controllers\Index\ArticleController.php 编辑控制器 index() 方法 如下
public function index(){ return view('Index.article.article'); }
3，\routes\web.php 前台分组路由下增加 文章路由
Route::get('article/{id}',"ArticleController@index")->name('index.article.index')->where(['id'=>'\d+']);
4，浏览器访问 http://laravel.pensive.top/article/1 效果如下
5，\resources\views\Index\ 下新建 Layout 公共模板目录，新建 left.blade.php 和 right .blade.php，从首页和文章页分离出来的公共部分的代码 如下
left.blade.php：
<div class="left-col sidebar-2"> <div class="site-branding"> <div id="logo"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" class="custom-logo-link" rel="home"><img width="240" height="120" src="http://laravel.pensive.top/static/index/imgs/logo.png" class="custom-logo" alt="自媒体二号"></a> </div><!-- #logo --> </div><!-- .site-branding --> <nav id="primary-nav" class="primary-navigation phone_menu_col_4"> <div class="menu-primary-container"><ul id="primary-menu" class="sf-menu sf-js-enabled sf-arrows" style="touch-action: pan-y;"> <li id="menu-item-492" class="color1 menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-492"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" aria-current="page">旅游攻略</a> </li> <li id="menu-item-492" class="color1 menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-492"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" aria-current="page">教育公益</a> </li> <li id="menu-item-492" class="color1 menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-492"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" aria-current="page">财经股票</a> </li> <li id="menu-item-492" class="color1 menu-item menu-item-type-custom menu-item-object-custom current-menu-item current_page_item menu-item-home menu-item-492"> <a href="https://www.zhutibaba.com/demo/zimeiti2/" aria-current="page">大牛课堂</a> </li> </ul></div> </nav><!-- #primary-nav --> <!--<div id="slick-mobile-menu"></div>--> <span class="search-icon"> <span class="genericon genericon-search"> <span>搜索</span></span> <span class="genericon genericon-close"> <span>收起</span></span> </span> <div class="header-search"> <form id="searchform" method="get" action="https://www.zhutibaba.com/demo/zimeiti2/"> <input type="search" name="s" class="search-input" placeholder="请输入关键词" autocomplete="off"> <button type="submit" class="search-submit">搜索</button> </form> </div><!-- .header-search --> </div>
right.blade.php：
<div id="zimeiti_2-views-2" class="widget widget-zimeiti_2-views widget_posts_thumbnail"><h2 class="widget-title"><span>浏览最多的文章<span></span></span></h2><ul><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/294.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/g17-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/294.html" rel="bookmark">超美的三亚,5天4晚全五星酒店高大上自由行</a><div class="entry-meta">2018-07-27</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/176.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/g8-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/176.html" rel="bookmark">呼伦贝尔: 你不可错过的辽阔草原和兴安秋色!</a><div class="entry-meta">2018-08-03</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/341.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/b43-120x85.jpeg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/341.html" rel="bookmark">海关总署：已立即暂停采购和使用长春长生各类疫苗</a><div class="entry-meta">2018-07-25</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/70.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/18-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/70.html" rel="bookmark">世界杯最大牌女球迷，一举动令人钦佩</a><div class="entry-meta">2018-07-07</div></div></li><li class="clear"><a href="https://www.zhutibaba.com/demo/zimeiti2/168.html" rel="bookmark"><div class="thumbnail-wrap"><img width="120" height="85" src="https://www.zhutibaba.com/demo/zimeiti2/wp-content/uploads/sites/5/2018/07/g1-120x85.jpg" class="attachment-zimeiti_2_widget_post_thumb size-zimeiti_2_widget_post_thumb wp-post-image" alt=""></div></a><div class="entry-wrap"><a href="https://www.zhutibaba.com/demo/zimeiti2/168.html" rel="bookmark">JEEP全新牧马人高清官图曝光,彰显与时俱进的新一代野性!</a><div class="entry-meta">2018-07-30</div></div></li></ul></div>
然后，\resources\views\Index\Index\index.blade.php 和 \resources\views\Index\Cate.blade.php 和 \resources\views\Index\Article.blade.php 这三个模板 的公共部份对应位置 分别用
@include('Index.Layout.left')
和
@include('Index.Layout.rigth')
代替即可。
6，命令行，用命令新建前台的公共控制器BaseConrtorller.php
php artisan make:controller Index/BaseController
7，前台控制器 App\Http\Controllers\Index目录下的 Articlecontroller.php,CateController.php,IndexController.php 分别修改为 引用 BaseController.php 的形式 如下
<?php namespace App\Http\Controllers\Index; class ArticleController extends BaseController { public function index(){ return view('Index.article.article'); } }
<?php namespace App\Http\Controllers\Index; class CateController extends BaseController { public function index(){ return view('Index.cate.cate'); } }
<?php namespace App\Http\Controllers\Index; class IndexController extends BaseController { public function index(){ return view('Index.index.index'); } }
END
浙公网安备 33010602011771号