Tình cờ qua trang blogspot mang về chế :v .Dự là sẽ làm nhiều trang chủ nên đặt là ver 1 nhé :D
Thông tin:
Demo ảnh:
![[Đóng góp] Share trang chủ auto cập nhật ver 1 RkZPgGC](https://i.imgur.com/RkZPgGC.png)
![[Đóng góp] Share trang chủ auto cập nhật ver 1 X0ylBRJ](https://i.imgur.com/x0ylBRJ.png)
Demo online: http://www.plusvn.net/h43-trang-chu
Code sử dụng feed rss nhé @@~
Cách làm:
tạo một html mới
Title: ghi gì cũng dc
Use this page as homepage ? chọn Có
Code:
Chú ý mấy chỗ /feed/?f=4 /feed/?f=8 /feed/?f=35 thay thành id chuyên mục của bạn :v
Thông tin:
Chế by: Dang0123
Vui lòng không xóa dòng bản quyền và textlink cuối trang
Cảm ơn rất nhiều
Demo ảnh:
Demo online: http://www.plusvn.net/h43-trang-chu
Code sử dụng feed rss nhé @@~
Cách làm:
tạo một html mới
Title: ghi gì cũng dc
Use this page as homepage ? chọn Có
Code:
- Spoiler:
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" id="min-width" lang="vi" xml:lang="vi" xmlns:og="http://opengraphprotocol.org/schema/" >
<head>
<title>Diễn Đàn Plusvn.Net</title>
<meta content='deskripsi blog kamu' name='Diễn đàn chia sẻ game, anime, video'/>
<meta content='keyword blog kamu' name='gunny private, game offline, game online private, web game private, phan mem, ghost win 7, ghost win xp, tai anime, anime vietsub, anime mp4 hay, anime convert cho mobile, anime mobile, download anime, game lau, gunny lau, gunny private 2014'/>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style id='page-skin-1' type='text/css'><!--
/**
* Theme Name: Shiroi
* Theme URL: http://shiroi-bt.blogspot.com/
* Description: Minimalist Blogger template
* Author: Johanes DJ
* Author URL: http://Djogzs.blogspot.com
*
*/
.navbar {
visibility:hidden;
display:none;
}
#content{
max-width: 600px;
float: left;
position: relative;
width: 100%;
}
.postim{
background:#fff;
padding:10px;
margin-top:10px;
}
.profile-textblock {
margin: .5em 0;
text-align: justify;
font-family: 'Segoe UI Semilight', 'Open Sans', Verdana, Arial, Helvetica, sans-serif;
font-weight: 300;
font-size: 10pt;
letter-spacing: 0.02em;
line-height: 20px;
font-smooth: always;
}
.profile-img {
float: left;
margin: 0 5px 5px;
border: 1px solid #DDD;
padding: 5px;
border-radius: 5px;
}
.PopularPosts img{padding: 0px;
border-radius: 50px;
border: 4px solid #f0f0f0;}
.item-snippet{
font-style: italic;
color: #777;
line-height: 26px;
font-size: 9pt;}
.PopularPosts .item-thumbnail {
float: left;
margin: 0 5px 5px 0;
height: 72px;
padding: 5px;
}
.comments .comments-content .user {
font-weight: bold;
font-size: 12pt;
color: #474747;
}
.comments {
clear: both;
background: #FAFAFA;
padding: 30px;
}
.comments .comments-content .datetime {
margin-right: 10px;
font-style: normal;
font-weight: 200;
font-size: 8pt;
letter-spacing: 0.01em;
color: #fff;
position: absolute;
bottom: 12px;
right: 0px;
}
.post h2{
text-align: left;
color: #474747;
padding: 10px;
font-weight: bold;
font-size: 13pt;
text-transform: uppercase;
padding-top: 20px;
}
.post h2 a:link,.post h2 a:visited{
color:#474747;
}
.arrow{
position:absolute;
top:50px;
left:-10px;
height:30px;
width:10px;
}
.postright:hover .jomore{opacity:1}
.postright{
position: relative;
}
.postright img{width:100%;height: auto;}
.author,.clock{
padding: 3px 20px;
margin: 0px 0px 0px -10px;
font-size: 11px;
color: #000;
text-transform: uppercase;
border-bottom: 1px solid #ddd;
}
.clock {float:right;}
.widget-content{padding: 10px;
color: #666;
padding-bottom: 15px;}
.comments .comments-content .comment-header, .comments .comments-content .comment-content {
margin: 0 10px 8px;
}
#ArchiveList ul li {
margin: -6px 0 0 10px !important;
}
#ArchiveList ul li a:link, #ArchiveList ul li a:visited {
padding: 0px 0px 0px 10px !important;
margin:5px;
}
#commentsbox {
margin:0;
width:600px;
}
h3#comments{
font-size30px;
font-family: 'Open Sans', sans-serif;
color:#ffffff;
font-weight:normal;
padding:10px 10px ;
background:#D3D4CE;
margin-top:10px;
}
ol.commentlist {
margin:0px 0 0;
clear:both;
overflow:hidden;
list-style:none;
}
ol.commentlist li {
margin:0px 0;
line-height:18px;
padding:10px;
background:#78786D;
}
ol.commentlist li .comment-author {
color:#ffffff;
}
.comment-body {
margin: auto;
-webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.5);
-moz-box-shadow: 0 1px 4px rgba(0,0,0,0.5);
box-shadow: 0 1px 4px rgba(0,0,0,0.5);
padding: 5px;
}
ol.commentlist li .comment-author a:link,ol.commentlist li .comment-author a:visited{
color:#ffffff;
font-weight:bold;
text-decoration:none !important;font-size:15px;font-family: 'Open Sans', sans-serif;}
}
ol.commentlist li .comment-author .fn {
color:#000;
}
ol.commentlist li .comment-author .avatar{
float:right;
background:#fff;
padding:3px;
}
.comments .comments-content .comment-content {
text-align: justify;
border-bottom: 1px solid #DDD;
padding-top: 10px;
font-style: normal;
font-size: 10pt;
letter-spacing: 0.01em;
color: #000;
}
.comments .comment .comment-actions a {
padding: 5px;
font-size: 11px;
font-family: 'Open Sans', sans-serif;
text-align: center;
color: #222;
margin: 5px;
position: relative;
}
.comments .comments-content .comment-replies {
margin-left: 65px;
margin-top: 1em;
}
.comments .comments-content .inline-thread {
padding: .5em 0em;
}
.comments h4{
font-weight: bold;
font-size: 15pt;
letter-spacing: 0.01em;
color: #474747;
text-align: center;}
.comments .continue a {
padding: 5px;
font-size: 13px;
text-decoration: none;
text-align: center;
color: #fff;
margin-left: 90px;
background: #2ABEC0;
text-transform: uppercase;
}
.avatar-image-container {
float:right;
height:50px;
width:65px;
}
.avatar-image-container img {
height:50px;
width:50px;
}
.comments .avatar-image-container {
float: left;
max-height: 75px;
overflow: hidden;
width: 50px;
padding: 5px;
border-radius: 50px;
background: #fff;
border: 1px solid #2ABEC0;
margin-top: 0px;
}
.comments .avatar-image-container img {height:auto;border-radius: 50px;}
ol.commentlist li .comment-meta{
font-size:13px;font-family: 'Open Sans', sans-serif;
}
ol.commentlist li .comment-meta .commentmetadata{
color:#555;
}
ol.commentlist li .comment-meta a {
color:#ffffff;
text-decoration:none !important;
}
ol.commentlist li p {
line-height:22px;
margin-top:5px;
color:#FEFAEF;
font-size:12px;
}
ol.commentlist li .reply{
margin-top:10px;
font-size:10px;
}
ol.commentlist li .reply a{
background:#5F553B;
color:#fff;
text-decoration:none;
padding:3px 10px;
}
ol.commentlist li.odd {
background:#D3D4CE;
}
ol.commentlist li.even {
}
ol.commentlist li.even:hover{BACKGROUND:#D3D4CE;}
ol.commentlist li ul.children {
list-style:none;
margin:1em 0 0;
text-indent:0;
}
ol.commentlist li ul.children li.depth-2 {
margin:0 0 0px 50px;
}
ol.commentlist li ul.children li.depth-3 {
margin:0 0 0px 50px;
}
ol.commentlist li ul.children li.depth-4 {
margin:0 0 0px 50px;
}
ol.commentlist li ul.children li.depth-5 {
margin:0 0 0px 50px;
}
.comment-nav{
padding:5px ;
height:20px;
background:#C4D533;
}
.comment-nav a:link,.comment-nav a:visited{
color:#fff;
}
#respond{
padding:20px;
margin:20px 0px;
}
#respond h3 {
font-size: 20px;
font-family: 'Open Sans', sans-serif;
color: #000;
padding-bottom: 10px;
font-weight: normal;
}
#commentform p{
margin:5px 0px;
}
#respond label{
display:block;
padding:5px 0;
font-weight:bold;
color:#3F361F;
}
#respond label small {
font-size:10px;
}
#respond input {
margin-bottom:10px;
padding:5px 0px;
margin:0 10px 10px 0;
background:#6F6753;
color:#F7EEE9;
}
#commentform input{
width:99%;
}
#respond input#commentSubmit {
width:100px;
padding:5px 0px;
background:#B7CD2C;
color:#fff;
margin:10px 0px;
font-weight:bold;
cursor:pointer;
}
textarea#comment{
background:#6F6753;
width:99%;
margin:0px 0px;
padding:5px 0px;
color:#F7EEE9;
}
html,body,div,span,object,h1,h2,h3,h4,h5,h6,p
,pre,a,abbr,acronym,address,big,cite
,code,del,dfn,em,img,ins,kbd,q,samp,small
,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,
form,label,legend,table,caption,tbody,tfoot,
thead,tr,th,td{
margin:0;
padding:0;
vertical-align:baseline;
outline:none;
}
b,i,hr,u,center,menu,layer,s,strike,font,xmp
{
margin:0;
padding:0;
vertical-align:baseline;
outline:none;
font-size:100%;
background:transparent;
border:none;
}
font{
color:#333
}
center{
text-align:left
}
body {
margin: 0 auto;
padding: 0px 0px 0px 0px;
font-family: 'Open Sans', sans-serif;
color: #312C21;
overflow-x: hidden;
font-size: 13px;
background:#F0F0F0;
}
a {
color: #222;
text-decoration: none;
}
a:visited {
color: #000;
}
a:hover, a:active {
color: #000;
text-decoration:none;
}
h1,h2, h3, h4, h5, h6 {
color: #000;
font-weight: bold;
}
h1 {
font-size: 85px;
font-family: 'Open Sans', sans-serif;}
h2 {
font-size: 21px;
}
h3 {
font-size: 19px;
}
h4 {
font-size: 17px;color:#222;
}
h5 {
font-size: 15px;
}
h6 {
font-size: 13px;
}
ul {
list-style: none;
}
blockquote {
font-style: italic;
color: black;
border: 1px double #DDD;
padding: 25px;
border-radius: 5px;
overflow: hidden;
background: white;
}
blockquote blockquote {
color: #222;
}
blockquote em {
font-style: normal;
}
pre {
padding: 9px;
background: #f9f9f9;
border: 1px solid #ccc;
overflow:hidden;
}
code {
padding: 0 3px;
background: #eee;
}
pre code {
background: transparent;
}
.clear {
clear:both;
}
img.centered {
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
padding: 0px;
}
#casing{
width: 100%;
max-width: 930px;
margin: auto;
padding-top: 20px;
}
#wrapper{
max-width:1000px;
width:100%;
margin:auto;
}
#header{
max-width: 100%;
position: relative;
margin: auto;
overflow: hidden;
background: #373737;
}
.header-wrap {max-width: 930px;margin:auto;position:relative;}
h1#blog-title {
text-align: left;
margin-top: 20px;
font-weight: 200;
font-size: 40pt;
color: #fff;
line-height: 45px;
}
h1#blog-title a {padding:5px;color:#fff;}
h1#blog-title a:link,h1#blog-title a:visited {
color: #fff;
}
h2#blog-desc {
padding: 5px;
text-align: left;
font-family: 'Segoe UI Light', 'Open Sans', Verdana, Arial, Helvetica, sans-serif;
font-weight: 200;
font-size: 15pt;
letter-spacing: 0.01em;
color: #fff;
margin-bottom: 20px;
}
.title h2{
text-decoration: none;
padding: 10px;
margin-bottom: 15px;
text-align: left;
margin: auto;
font-weight: bold;
font-size: 20pt;
color: #fff;
}
.title h2 a:link, .title h2 a:visited{
color:#000;text-decoration: none;
}
.timemeta {float: left;
margin-left: 10px;
padding-right: 10px;
border-right: 1px solid #AEAEAE;
color: #AEAEAE;
text-transform: uppercase;
font-size: 8pt;}
.author1 {float: left;
margin-left: 10px;
padding-right: 10px;
border-right: 1px solid #AEAEAE;
color: #AEAEAE;
text-transform: uppercase;
font-size: 8pt;}
.postmeta, .postinfo{
background:#F5ECC1;
padding:3px 10px;
border:1px solid #DFD5A7;
font-size:10px;
text-transform:uppercase;
}
.post {
border-bottom: 1px solid #ddd;
position: relative;
width: 100%;
margin-bottom: 20px;
background: #fff;
float: right;
max-width: 480px;
border-radius: 2px;}
.pagepost ul {list-style: disc;}
.pagepost{
width: 550px;
float: left;
padding: 10px;
line-height: 2.0;
margin-bottom: 25px;
font-weight: 300;
font-size: 10pt;
}
.pagepost a{color:#2D5A9A;text-decoration:underline;}
.pagepost a:hover {color:#2B5795;}
.widget {
margin: auto;}
.singlepst p:first-letter {
font-size : 30px;
font-weight : bold;
float : left;
font-family: 'Open Sans', sans-serif;
color : #3F3A2B;
margin:8px 5px 0px 0px;
}
.cover {
margin: 0 0;
color: #222;
margin-bottom: 10px;
}
h2.pagetitle{
font-size: 12px;
padding: 10px 0px;
font-weight: normal;
margin-right: 10px;
color: #6F6753;
text-align: center;
}
.comments .avatar-image-container img {
max-width: 50px;
}
.PopularPosts .item-title a {font-size: 15pt;}
#main2 .widget-content {
overflow: hidden;
margin-bottom: 20px;
padding: 20px;
padding-top:10px;
background: #fff;
font-size: 10pt;
letter-spacing: 0.02em;
line-height: 20px;
border-bottom: 1px solid #ddd;
text-align: left;
padding-left: 15px;
font-weight: normal;
color: #474747;
border-radius: 0px 0px 2px 2px;
}
#main2 h2:hover {cursor:pointer;}
#main2 h2{
text-align: left;
margin: auto;
padding: 20px 5px;
border-radius: 2px 2px 0px 0px;
padding-left: 15px;
color: #474747;
text-transform: uppercase;
background: #fff;
font-weight: bold;
font-size: 13pt;}
#main2 ul li a:link, #main2 ul li a:visited {-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
font-weight: 200;
font-size: 10pt;
text-transform: uppercase;
letter-spacing: 0.01em;
line-height: 24pt;
font-smooth: always;
color: ##8AA6B4;}
#main2 ul li{border-bottom: 1px solid #DDD;}
#main2 ul li a:hover{color:#2D89EF;-webkit-transition: all 0.1s ease-in-out;-moz-transition: all 0.1s ease-in-out;}
.fleft{
text-align: center;
margin: auto;
width:100%;
padding-top: 10px;
padding-bottom: 10px;
color: #474747;
font-family: 'Segoe UI Semilight', 'Open Sans', Verdana, Arial, Helvetica, sans-serif;
font-weight: 300;
font-size: 8pt;
margin-top:30px;
text-transform: uppercase;
background:#fff;}
.fleft p {text-align: center;}
.fleft a{color:#2ABEC0;}
#Label1 ul li{font-family: 'Open Sans', sans-serif;}
#LinkList1 ul li{font-family: 'Open Sans', sans-serif;}
.crop-wrap{
position: absolute;
width: 80px;
height: 80px;
overflow: hidden;
left: -105px;
border-radius: 50px;
top: 0px;
box-shadow: 1px 1px 0px rgba(0,0,0,0.1);
border: 4px solid #fff;
background: url(http://1.bp.blogspot.com/-_rVBDk7MBgs/UeW2vn3fwWI/AAAAAAAAGzI/ONP2vpF-MdE/s1600/Untitled-1.png);
background-size: 80px;}
.crop-wrap-dalem{margin-left: -60px;
width: 200px;}
.crop {
width: 170px;
height: 100%;
overflow: hidden;
margin: auto;}
.posting {
padding: 0px 15px 10px 15px;
font-family: 'Segoe UI Semilight', 'Open Sans', Verdana, Arial, Helvetica, sans-serif;
font-weight: 300;
font-size: 8pt;
letter-spacing: 0.02em;
line-height: 20px;
text-align: justify;
position:relative;
display:none;
min-width: 120px;}
.breadcrumb ul{margin:auto;}
.breadcrumb ul li a{padding-right:30px;color:#000;font-weight:bold;}
.breadcrumb li {
position: relative;
display: block;
color: #474747;
font-weight: bold;
font-size: 14px;
float: left;
text-decoration: none;
letter-spacing: 0.02em;
padding: 10px 10px;}
.breadcrumb{
width: 100%;
float: left;
margin-bottom: 30px;
text-transform: uppercase;
}
.home-link {
display:none;}
#blog-pager-newer-link {
float: right;
color: white;
padding: 10px;
text-align: center;
overflow: hidden;}
#blog-pager-older-link {
float: left;
padding: 10px;
text-align: center;
overflow: hidden;}
#blog-pager-older-link a, #blog-pager-newer-link a {color: #bbb;
line-height: 33px;
padding: 5px;}
#blog-pager {
color: #DDD;
text-transform: uppercase;
font-size: 20px;
float: left;
font-weight: bold;
font-family: 'Open Sans', sans-serif;
transition: all 0.2s ease-in-out;
width: 100%;}
.comments .comments-content {position: relative;
margin-bottom: 16px;}
.comments .comment-block {
margin-left: 90px;
position: relative;
background: white;
padding: 10px;}
.blognames {margin:auto;}
.jomore {position: relative;
font-weight: normal;
width: 100%;
padding-bottom: 35px;}
.jomorelink{
text-align: center;
text-transform: uppercase;
position: absolute;
bottom: -9px;
right: 0px;
opacity:0;
background: #2ABEC0;
padding: 5px;
font-size: 10px;
border-radius: 2px 0px 0px 2px;
-moz-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.post:hover .jomorelink{opacity:1;}
.pagepost a {text-decoration: underline;}
.pagepost img{padding: 0px;
border: 5px solid #fff;
max-width: 510px;}
.BlogArchive #ArchiveList ul li {
background: none;
list-style: none;
list-style-image: none;
list-style-position: outside;
border-width: 0;
padding-left:0px;
text-indent:0px;
margin:0;
background-image: none;}
#ArchiveList .toggle-open {
line-height: .6em;
float: left;
margin-top: 8px;}
.post-count {display:none;}
.post-footer-line-1 {
border-top: 1px solid #fafafa;}
.icon-action {display:none;}
#search input[type="text"] {
background: #fff;
font-size: 13px;
background-position-y: 10px;
color: #222;
max-width: 278px;
padding: 10px;
border: 1px solid #fff;
height: 30px;
font-family: 'Open Sans', sans-serif;
border-bottom: 1px solid #ddd;
width: 100%;
text-transform: uppercase;}
.main2 {width: 100%;list-style-type: none;}
::-webkit-scrollbar {
width: 6px;
background: #474747;}
::-webkit-scrollbar-thumb {background: #2ABEC0;}
a.anes{
font-size: 10pt;
color: #fff;
font-weight: bold;}
.label-size a{-moz-transition: all 0.1s ease-in-out;
-webkit-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;color:#fff}
.label-size a:hover{color:#222;-moz-transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;}
.comment-form {
max-width: 520px;
_width: 410px;
clear: both;
background: white;
padding: 20px;
border: 1px solid #DDD;
border-radius: 5px;}
.widget-item-control a{display:none;}
.PopularPosts .item-title a {font-size:20pt;
padding-bottom: .2em;}
.readmore {width: 370px;
border-bottom: 1px solid #ddd;}
#Navbar1, #Attribution1 {display:none;}
.bigcom {width: 234px;text-align: center;}
.posted {
width: 300px;
border-right: 1px solid #ddd;
text-align: center;}
a.comment-link {float: left;
margin-left: 10px;
padding-right: 10px;
color: #AEAEAE;
text-transform: uppercase;
font-size: 8pt;}
.profile-name-link {
background: no-repeat left top;
display: inline;
min-height: 20px;
padding-left: 20px;
}
.label-size:hover {background: #2ABEC0;color:#222;-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;}
.label-size {
background: #5D5D5D;
padding: 5px;
margin: 2px;
font-size: 12px;
float: left;
overflow: hidden;
text-align: left;
-moz-transition: all 0.9s ease-in-out;
-webkit-transition: all 0.9s ease-in-out;
-o-transition: all 0.9s ease-in-out;
transition: all 0.9s ease-in-out;
color: #fff;
text-transform: uppercase;
border-left: 5px solid #2ABEC0;}
#menujohanes{
width:100%;
font-size: 10pt;
margin: auto;
background: #5d5d5d;
height: 50px;
-moz-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
text-transform: uppercase;
position: relative;}
#menujohanes ul{
list-style-type: none;
z-index: 9;
max-width: 930px;
margin: auto;}
#menujohanes ul li{
float: left;
position: relative;
padding: 12px;
-moz-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;}
#menujohanes ul li:hover a.menu{color:#fff;}
#menujohanes ul li:hover{
background:#474747;}
#menujohanes ul li a:hover {
color:#fff;}
#menujohanes ul li a{
color: #fafafa;
padding: 0 10px;
line-height:25px;
font-weight:bold;
font-size: 10pt;
display:block;
text-decoration:none;
-moz-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;}
#menujohanes ul li ul li{float: none;position: relative;}
#menujohanes ul li ul{
position: absolute;
top:49px;
left:0;
-moz-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
display:none;
background: #5d5d5d;}
#menujohanes:hover ul li ul {width:150px;}
#menujohanes ul li:hover > ul{-moz-transition: all 0.5s ease-in-out;
-webkit-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;display:block; }
#menujohanes ul li ul li a{line-height:25px;}
#menujohanes ul li ul li ul{
position: absolute;
top:0; left:150px;
width:150px;
background: #5d5d5d;}
#menujohanes ul li.selected a{font-size: 10pt;font-weight:bold;}
#menujohanes ul li.selected{color: #fff;background: #474747;font-weight:bold;}
.pinterestjo:hover, .twitterjo:hover, .facebookjo:hover, .googlejo:hover {background-color:#65C7CA;}
.pinterestjo, .twitterjo, .facebookjo, .googlejo {
font-size: 13px;
color: #222;
width: 100%;
z-index: 9;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
height: 45px;}
/* Blog johanes djogzs.blogspot.com */
.twitterjo{
background: #5d5d5d url("http://4.bp.blogspot.com/-8BAKelUOAUY/UTyKNEclkHI/AAAAAAAAF3w/JWk7Bt7gJ6s/s1600/white_twitter_bird.png")no-repeat center center;}
.facebookjo {
background: #474747 url("http://3.bp.blogspot.com/-vG6u1PK9oY0/UTyKNIjeVvI/AAAAAAAAF3o/Vr5nEq6jrAw/s1600/white_facebook.png")no-repeat center center;}
.googlejo{
background: #474747 url("http://2.bp.blogspot.com/-VgoImgPXil8/UbNUTrYoCqI/AAAAAAAAGUw/hCImmM-IYZw/s1600/footer-icon-google.png")no-repeat center center;}
.pinterestjo{
background: #5D5D5D url("http://2.bp.blogspot.com/-9piAQfPmxa8/UZ-rdm96t7I/AAAAAAAAGKw/BZQeZleoZhI/s1600/white_pinterest.png")no-repeat center center;}
/* Blog johanes djogzs.blogspot.com */
.jorib {
width: 45px;
height: 109px;
position: fixed;
top: 173px;
right: 0px;
z-index: 9;
}
#featured{
max-width: 930px;
position: relative;
height: 300px;
background: #2ABEC0;
margin: auto;
overflow: hidden;
}
#featured ul.ui-tabs-nav{
position: absolute;
top: 0;
right: 0px;
list-style: none;
padding: 0;
margin: 0;
width: 340px;
z-index: 9;
height: 300px;
overflow-y: scroll;
}
#featured ul.ui-tabs-nav li{
padding: 0px;
padding-left: 34px;
font-size: 12px;
color: #666;
}
#featured ul.ui-tabs-nav li span{
font-size: 15px;
line-height: 75px;
padding-right: 10px;
}
#featured .ui-tabs-panel{
width: 620px;
height: 300px;
background: #999;
position: relative;
overflow: hidden;
}
#featured .ui-tabs-hide{display:none;}
#featured li.ui-tabs-nav-item a{
display: block;
height: 74px;
color: #fafafa;
-moz-transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
background: #373737;
line-height: 20px;
outline: none;
padding: 13px 0px;
}
#featured li.ui-tabs-nav-item a:hover{
background:#5D5D5D;color:#fff;
}
#featured li.ui-tabs-selected{background:url("http://3.bp.blogspot.com/-KQZX_lq5neo/UeWmhe_BpVI/AAAAAAAAGyo/3dBfFeO2AHc/s1600/Untitled-1.png") top right}
#featured ul.ui-tabs-nav li.ui-tabs-selected a{background:#474747;color:#fff;}
#featured ul.ui-tabs-nav li img{
float: left;
margin: 2px 5px;
background: #2ABEC0;
padding: 4px;
height: 63px;
width: 63px;
border-radius: 50px;
}
#featured .ui-tabs-panel .info{
position: absolute;
bottom: 0px;
left: 0;
height: 65px;
max-width: 600px;
background:rgba(0,0,0,0.5);
padding: 10px;
width: 100%;
}
#featured .info h2{
font-size: 15pt;
color: #fff;
font-family: 'Open Sans', sans-serif;
font-weight: bold;
}
#featured .info p{
font-size: 13px;
line-height: 15px;
color: #fff;
font-style: italic;
}
#featured .info a{
text-decoration:none;
color:#fff;
}
#featured .info a:hover{text-decoration:underline;}
#topic1 li {
border-bottom: 1px solid #DDD;padding: 5px;
}
#topic2 li {
border-bottom: 1px solid #DDD;padding: 5px;
}
#topic3 li {
border-bottom: 1px solid #DDD;padding: 5px;
}
.sidebar {
float: right;
width: 300px;
position: relative;
}
--></style>
<style>
@media screen and (max-width:930px){
#featured{height:0px;}
#content {
max-width: 600px;
float: none;
position: relative;
width: 100%;
margin: auto;
}
#search input[type="text"]{max-width: 930px;}
#menujohanes {display: inline-table;}
#menujohanes ul{width:auto;}
#menujohanes ul li {float: none;padding:5px;border-bottom: 1px solid #ddd;}
#menujohanes ul li ul {top:0px;position:relative;display: none;box-shadow: none;width: 100%;}
#menujohanes:hover ul li ul {width:100%;}
.jorib{display:none;}
h1#blog-title{text-align:center;}
h2#blog-desc{text-align:center;}
}
</style>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'/>
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 100;
summary_img = 100;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<div class="crop"><img src="'+img[0].src+'" max-width="535;" /></div>';
summ = summary_img;
}
var summary = imgtag + '<div class="posting">' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>
<script type="text/javascript">var a="indexOf",b="&m=1",e="(^|&)m=",f="?",g="?m=1";function h(){var c=window.location.href,d=c.split(f);switch(d.length){case 1:return c+g;case 2:return 0<=d[1].search(e)?null:c+b;default:return null}}var k=navigator.userAgent;if(-1!=k[a]("Mobile")&&-1!=k[a]("WebKit")&&-1==k[a]("iPad")||-1!=k[a]("Opera Mini")||-1!=k[a]("IEMobile")){var l=h();l&&window.location.replace(l)};
</script><script type="text/javascript">
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script></head>
<body class='home blog'><div class='jorib'><a href='#' target='_blank'><div class='googlejo'></div></a>
<a href='#' target='_blank'><div class='twitterjo'></div></a>
<a href='#' target='_blank'><div class='facebookjo'></div></a>
<a href='#' target='_blank'><div class='pinterestjo'></div></a>
</div><div id='header'><div class='header-wrap'><div class='blognames section' id='blognames'><div class='widget Header' id='Header1'>
<h1 id='blog-title'><span>
<a href='/' rel='home' title='Shiroi'>Plusvn.Net</a>
</span></h1>
<h2 id='blog-desc'><span>
Giải trí là tất cả
</span></h2>
</div></div>
</div></div><div id='menujohanes'>
<ul>
<li class='selected'><a href='/' title='Home'>Home</a></li>
<li><a class='menu' href='/forum'>Vào Diễn Đàn</a>
</li>
<li><a class='menu' href='/f1-'>Game Private</a>
<ul>
<li><a href='/f8-'>Gunny Private</a></li>
<li><a href='/f9-'>Kiếm Thế</a></li>
<li><a href='/f10-'>MU private</a></li>
<li><a href='/f11-'>JX private</a></li>
<li><a href='/f14-'>Webgames</a></li>
<li><a href='/f15-'>Game khác</a></li>
</ul>
</li>
<li><a class='menu' href='/f21-'>Anime Download</a>
<ul>
<li><a href='/f37-'>Ongoing</a></li>
<li><a href='/f38-'>Completed</a></li>
<li><a href='/f49-'>Convert Mobile</a></li>
</ul>
</li>
<li><a class='menu' href='f61-'>Plus Sub</a></li>
<li><a class='menu' href='/f39-'>Hayo Fansub</a></li>
</ul>
</div><div id='wrapper'><div id='featured'>
<ul class='ui-tabs-nav'>
<li class='ui-tabs-nav-item ui-tabs-selected' id='nav-fragment-1'><a href='#fragment-1'>
<img alt='' src='https://lh4.googleusercontent.com/-iReJTjToddQ/U70HWIimI_I/AAAAAAAABYU/M_1Jqz1SwSU/Plus.5Forum.net-logo1.png
'/>
<span>Sword Art Online II</span></a></li>
<li class='ui-tabs-nav-item' id='nav-fragment-2'><a href='#fragment-2'>
<img alt='' src='https://lh3.googleusercontent.com/-CYjBTM1Fcsc/U7aF0VFP7_I/AAAAAAAABOM/mpL5jYt8FTs/s800/Plus.5Forum.net-bt3910-3.jpg'/>
<span>Fairy Tail Chap 391</span></a></li>
<li class='ui-tabs-nav-item' id='nav-fragment-3'><a href='#fragment-3'>
<img alt='' src='https://scontent-a-lax.xx.fbcdn.net/hphotos-xpa1/t1.0-9/10384664_508002432633999_5049619457818759373_n.jpg'/>
<span>Fairy Tail Special</span></a></li>
</ul><div class='ui-tabs-panel' id='fragment-1' style=''>
<img alt='' src='http://www.swordart-online.net/phantom/img/top/bg/bg1.jpg'/><div class='info'><h2><a href='#'>Sword Art Online II : Gun Gale Online</a></h2>
<p>Chính thức lên sóng, đây là ss2 có tên là "MA ĐẠN" hay Gunz Online =))</p>
</div></div>
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-2' style=''>
<img alt='fairy tail chap 391' src='https://lh5.googleusercontent.com/-1JwppzMcytY/U7aHVIhmWoI/AAAAAAAABQc/afK2Waq6v5Y/s800/Plus.5Forum.net-bt4210-20_2.jpg'/><div class='info'><h2><a href='http://www.plusvn.net/t2188-topic'>Fairy Tail chap 391 vietsub</a></h2>
<p>Cuộc chiến giữa Gray và cha đang đến hồi gay cấn</p>
</div></div>
<div class='ui-tabs-panel ui-tabs-hide' id='fragment-3' style=''>
<img alt='' src='https://scontent-a-lax.xx.fbcdn.net/hphotos-xpa1/t1.0-9/10384664_508002432633999_5049619457818759373_n.jpg'/><div class='info'><h2><a href='http://www.plusvn.net/t2134-topic'>Fairy Tail Special: Fairy Woman</a></h2>
<p>Một ngày kia, ở thị trấn nọ, có một cô gái tên là Erza...Muốn biết sự tình thì mời vào xem :v</p>
</div></div>
</div><div class='clear'></div>
<div id='casing'>
<div id='content'>
<div class='main section' id='main'>
<div class='widget Blog' id='Blog1'>
<div class='blog-posts hfeed'>
<div class="date-outer">
<div class="date-posts">
<div class='post-outer'>
<div class="show_topic"><div id="topic"></div>
</div></div></div></div></div></div></div></div>
<div class='sidebar'>
<form action='/search' id='search' method='get'>
<input name='q' placeholder='Search Somethings..' size='40' type='text'/></form>
<div class='main2 section' id='main2'>
<div class='widget PopularPosts' id='PopularPosts1'>
<h2>Thông báo mới</h2>
<div class='widget-content'>
<div id="topic1"></div>
<div class='clear'></div>
</div></div>
<h2>Event trên forum</h2>
<div class='widget-content'>
<div id="topic2"></div>
<div class='clear'></div>
</div>
<h2>Gunny Lậu Mới</h2>
<div class='widget-content'>
<div id="topic3"></div>
<div class='clear'></div>
</div>
<h2>Từ khóa hot</h2>
<div class='widget-content'>
<span class="label-size label-size-2">
<a dir="ltr" href="http://www.plusvn.net/f8-forum">gunny lau</a>
</span>
<span class="label-size label-size-2">
<a dir="ltr" href="http://www.plusvn.net/f14-forum">web game private</a>
</span>
<span class="label-size label-size-2">
<a dir="ltr" href="http://www.plusvn.net/">anime vietsub</a>
</span>
<div class='clear'></div>
</div>
</div></div></div>
<div class="clear"></div>
<div class="fleft">
<p>- Copyright © 2014 Plusvn.net - Powered by <a href="http://www.forumvi.com" target="_blank">Forumvi</a> - Designed by <a href="http://www.plusvn.net/" title="Dang0123">Dang0123</a> - <a href="http://www.plusvn.net/" title="gunny lau, game private, web game"><strong>web game private</strong></a> -</p></div>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).ready(function(){
$("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 6000, true);
});
</script>
<script>
$(function () {
$.ajax({
url: "/feed/?f",
success: function (ta) {
for (var i = 2; i < 17; i++) {
var DL = $(ta).find("link:eq(" + i + ")").text();
var title = $(ta).find("title:eq(" + i + ")").text();
$('<div class="news-item"><div class="post"><div class="postright"><div class="arrow"></div><div class="cover"><div class="crop-wrap"><div class="crop-wrap-dalem"><div id="summary"><div class="crop"><a href="' + DL + '" rel="bookmark"></a></div></div></div></div></div><h2></h2><div style="clear: both;"></div><div class="jomore"><span class="author1">Posted by: ' + $(ta).find("creator:eq(" + i + ")").text() + '</span><div class="timemeta">' + $(ta).find("pubDate:eq(" + i + ")").text() + '</div><a class="comment-link" href="/" title="' + title + '" rel="category">' + $(ta).find("category:eq(" + i + ")").text() + '</a><div class="jomorelink"><a class="anes" href="' + DL + '">Read More</a></div></div></div></div></div>').appendTo('div.show_topic #topic');
$('<a href="' + DL + '">' + title + '</a>').appendTo('.news-item:eq(' + (i - 2) + ') .post h2');
$('<img src="' + $(".news-item:eq(" + (i - 2) + ") .crop a:eq(0)").load(DL + ".post-entry .entry-content img:eq(0)") + '" alt="test" />').appendTo('.news-item:eq(' + (i - 2) + ') .crop a:eq(0)');
}
}
})
})
</script>
<script>
$(function () {
$.ajax({
url: "/feed/?f=4",
success: function (ta) {
for (var i = 2; i < 7; i++) {
var DL = $(ta).find("link:eq(" + i + ")").text();
var title = $(ta).find("title:eq(" + i + ")").text();
$('<li><a href="'+DL+'">'+title+'</a></li>').appendTo('#topic1');
}
}
})
})
</script>
<script>
$(function () {
$.ajax({
url: "/feed/?f=35",
success: function (ta) {
for (var i = 2; i < 7; i++) {
var DL = $(ta).find("link:eq(" + i + ")").text();
var title = $(ta).find("title:eq(" + i + ")").text();
$('<li><a href="'+DL+'">'+title+'</a></li>').appendTo('#topic2');
}
}
})
})
</script>
<script>
$(function () {
$.ajax({
url: "/feed/?f=8",
success: function (ta) {
for (var i = 2; i < 7; i++) {
var DL = $(ta).find("link:eq(" + i + ")").text();
var title = $(ta).find("title:eq(" + i + ")").text();
$('<li><a href="'+DL+'">'+title+'</a></li>').appendTo('#topic3');
}
}
})
})
</script>
</body>
</html>
Chú ý mấy chỗ /feed/?f=4 /feed/?f=8 /feed/?f=35 thay thành id chuyên mục của bạn :v
![[Đóng góp] Share trang chủ auto cập nhật ver 1 ZxRIxZc](https://i.imgur.com/zxRIxZc.png)
