所以,我对编码并不是那么好,但我设法在朋友的帮助下制作了这个主题。你可以在belimeyblake.tumblr.com上看到它 但我无法使无限滚动工作,因为帖子没有到达页面的底部。你们能帮忙吗?如果需要,请告诉我在哪里添加内容。 这是我的主题代码。
<style> body, a, a:hover { cursor:url('{text:Cursor Image URL}'), auto }</style>
<!--
Themes by Chloethemez // Dark orgasm
Classy theme.
Comments and suggestions are welcome
chloethemez.tumblr.com
-->
<html lang="en">
<head>
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<meta name="image:Background" content=""/>
<meta name="image:Ask pop up close button" content=""/>
<meta name="color:Background" content="#FFFFFF"/>
<meta name="color:Sidebar Background" content=""/>
<meta name="color:Post Background" content=""/>
<meta name="color:More Box Background" content=""/>
<meta name="color:Title" content="#999999"/>
<meta name="color:Blog Title" content="#999999"/>
<meta name="color:Text" content="#777777"/>
<meta name="color:Link" content="#555555"/>
<meta name="color:Hover" content="#999999"/>
<meta name="color:Borders" content=""/>
<meta name="color:Glitter Colour" content=""/>
<meta name="if:Sidebar image" content=""/>
<meta name="if:Sidebar background image" content=""/>
<meta name="if:Maximised background" content=""/>
<meta name="if:Disable right click" content=""/>
<meta name="if:Link two" content=""/>
<meta name="if:Link three" content=""/>
<meta name="text:Username" content=""/>
<meta name="text:Cursor image URL" content=""/>
<meta name="text:Favicon" content=""/>
<meta name="text:Online counter codes" content=""/>
<meta name="text:View counter codes" content=""/>
<meta name="text:Network badge codes" content=""/>
<meta name="text:Update one" content=""/>
<meta name="text:Update two" content=""/>
<meta name="text:Link One URL" content=""/>
<meta name="text:Link One Title" content="link"/>
<meta name="text:Link Two URL" content=""/>
<meta name="text:Link Two Title" content="link"/>
<meta name="text:Link Three URL" content=""/>
<meta name="text:Link Three Title" content="link"/>
<title>{Title}</title>
{block:Description}
<meta name="description" content="{MetaDescription}" />
{/block:Description}
<link rel="shortcut icon" href="{text:Favicon}">
<!---------------DO NOT REMOVE THESE SCRIPTS--------------->
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
//
$('a.poplight[href^=#]').click(function() {
var popID = $(this).attr('rel'); //Get Popup Name
var popURL = $(this).attr('href'); //Get Popup href to define size
var query= popURL.split('?');
var dim= query[1].split('&');
var popWidth = dim[0].split('=')[1]; //Gets the first query string value
$('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="{image:Ask Pop Up Close Button}" class="btn_close" title="Close" alt="Close" width="40"/></a>');
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
//Apply Margin to Popup
$('#' + popID).css({
'margin-top' : -popMargTop,
'margin-left' : -popMargLeft
});
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
return false;
});
$('a.close, #fade').live('click', function() {
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove(); //fade them both out
});
return false;
});
});
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
<script>
(function($){$(document)
.ready(function(){$("[title]")
.style_my_tooltips();});})
(jQuery);
</script>
{block:IndexPage}
<script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
<script type="text/javascript">
$(window).load(function(){
var $wall = $('#entries');
$wall.imagesLoaded(function(){
$wall.masonry({
itemSelector: '#post, #post_photo',
isAnimated : false
});
});
$wall.infinitescroll({
navSelector : '#pagination',
nextSelector : '#pagination a',
itemSelector : '#post, #post_photo',
bufferPx : 2000,
debug : false,
errorCallback: function() {
$('#scroll').fadeOut('normal');
}},
function( newElements ) {
var $newElems = $( newElements );
$newElems.hide();
$newElems.imagesLoaded(function(){
$wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
});
}); $('#entries').show(500);
});
</script>
{/block:IndexPage}
<!---------------END SCRIPTS--------------->
<style type="text/css">
::-webkit-scrollbar{ width:4px;
background-color:transparent; }
::-webkit-scrollbar-thumb{ background-color:{color:borders}; border: 0px solid #fff; }
/************EDIT BODY HERE************/
body{
margin:0px;
background-color: {color:Background};
background-attachment:fixed;
background-repeat:100%;
background-position:bottom-right;
font-family: Calibri;
font-size:11px;
letter-spacing:1px;
text-transform:uppercase;
text-align:left;
line-height:11px;
color: {color:Text};
background-image:url({image:Background});
{block:ifMaximisedBackground}
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
{/block:ifMaximisedBackground}
}
a:link, a:active, a:visited{
text-decoration: none;
color: {color:Link};}
a:hover {
color:{color:Link};
text-decoration:none;}
/************EDIT TOOLTIP HERE************/
#s-m-t-tooltip {
padding: 4px;
height:auto;
display: none;
font-family: consolas;
font-size: 10px;
max-width:150px;
text-transform:uppercase;
text-align: center;
letter-spacing:1px;
margin-top:10px;
margin-left: 15px;
line-height: 8px;
z-index: 999999999999;
border: 1px solid #f5f5f5;
background:#ffffff;
color: #888;}
/************EDIT POST POSITION/WIDTH HERE************/
/*To increase the amount of columns, increase the width. To decrease the amount of columns, decrease the width.*/
#entries{
text-align:left;
width:810px;
margin-left:20px;
margin-top:10px;
height:655px;
position:relative;
overflow: hidden;
{block:PermalinkPage}
width:550px;
{/block:PermalinkPage}}
#container {
z-index:99;
max-height: 600px;
width: 780px;
overflow: auto;
overflow-x:hidden;
margin-left:350px;
margin-top:19px;
border: 4px solid {color:borders};
}
/************EDIT OVERALL POSTS HERE************/
/*When increasing the amount of columns, you may have to decrease the #post width. Otherwise, to get larger posts, increase the width.*/
#post{
text-align:left;
margin-right:20px;
margin-top:10px;
margin-bottom:5px;
background:{color:Post Background};
padding-bottom:0px;
padding-left:0px;
padding-right:0px;
padding-top:0px;
max-width: 100%;
display:block;
overflow:hidden;
border:1px solid {color:borders};
width:230px;
{block:PermalinkPage}
width:500px;
{/block:PermalinkPage}}
/*Do not delete #post img.*/
#post img{
max-width:100%;}
/*Edit the permalinks all posts.*/
.permalink{
padding-top:0px;
border-top:1px solid {color:borders};
text-align:right;
margin-top:-2px;
}
.permalink a{
text-transform:uppercase;
background:{color:Post Background};
font-family:calibri;
font-size:9px;
line-height:15px;}
/*Edit the titles on any text-based post.*/
.posttitle{
font-size:10px;
text-align:center;
color:{color:Link};}
.posttitle a{
color:{color:Link};}
/************EDIT QUOTE POSTS HERE************/
.quote{
margin-right: 5px;}
.source{
padding-top:5px;
display:block;
text-align:right;}
/************EDIT ANSWER POSTS HERE************/
.ask{
padding:4px;
background:{color:Post Background};}
.asker{
color:{color:Link};}
.answer{
margin-top:10px;
padding:2px;
}
/************EDIT AUDIO POSTS HERE************/
.audio{
{block:IndexPage}width:180px;{/block:IndexPage}
{block:PermalinkPage}width:180px;{/block:PermalinkPage};}
.info{
padding:2px 0px 3px 2px;}
.i {
text-transform:uppercase;
letter-spacing:1px;
font-size:8px;}
.pl b,strong{
text-transform:lowercase;
font-size:9px;}
.player{
position:absolute;
overflow:hidden;
margin-top:0px;
margin-left:15px;
background:#ffffff;
width:24px;
height:23px;}
.cover {position: relative; z-index: 1}
.playbutton {width: 20px;
height: 30px;
overflow: hidden;
position: relative;
z-index: 1000;
margin: 15px 24px 13px 16px;}
.playbox {background-color: #000;
position: absolute;
z-index: 1000;
margin-top: 100px;
margin-left: 85px;
opacity: 0.5;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
}
/************EDIT VIDEO POSTS HERE************/
/***********DO NOT DELETE THIS CODE************/
.video-container {
position:relative;
padding-bottom:56.25%;
padding-top: 30px;
height:0;
overflow:hidden;}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;}
/************EDIT CHAT POSTS HERE************/
.chat{
line-height:12px;
list-style:none;}
.chat ul{
list-style:none;
padding:0px 5px;
line-height:15px;}
.label{
color:{color:Link};}
/************EDIT SIDEBAR HERE************/
#sidebar{
background:{color:Sidebar Background};
left:100px;
top:60px;
width:220px;
position:fixed;
height:auto;
text-align:center;}
.blogtitle{
text-align:right;
padding:5px;
font-family: 'Open Sans Condensed', sans-serif;
padding-bottom:0px;
font-size:16px;}
.blogtitle a{
color:{color:Blog Title};}
.description{
text-align:right;
padding:5px;}
.links{
text-align:right;
margin-left:65px;
padding:0px 10px 5px 10px;
margin-top:5px;
}
.links:hover{
text-align:right;
margin-left:35px;
padding:0px 10px 5px 10px;
margin-top:5px;
}
.links a{
margin-left:15px;
}
.links a:hover{
margin-left:;
color:{color:Hover};
}
/************EDIT TEXT SETTINGS HERE************/
i, em{
color:{color:Link};}
b, strong{
font-weight:normal;
text-transform:uppercase;
color:{color:Link};}
ul,ol{
margin:0px;
margin-left:-5px;}
p{
padding:0px;
margin:2px;}
u{
text-decoration:none;
color:{color:Title};}
blockquote {
margin:0px;
padding:4px;
background:{color:Post Background};}
/************DO NOT DELETE #SCROLL************/
#scroll{
bottom:-20px;
position: absolute;
left: 50%;
width:10px;
height:5px;
overflow:hidden;
margin-bottom:80px;}
#fade { /*--Transparent background layer--*/
display: none; /*--hidden by default--*/
background: #000;
position: fixed; left: 0; top: 0;
width: 100%; height: 100%;
opacity: .80;
z-index: 9999;
}
.popup_block{
display: none; /*--hidden by default--*/
background: #fcfbf8;
padding: 10px;
border: 5px solid #f2e7e2;
float: left;
font-size: 10;
position: fixed;
top: 50%; left: 50%;
z-index: 99999;
/*--CSS3 Box Shadows--*/
-webkit-box-shadow: 0px 0px 20px #000;
-moz-box-shadow: 0px 0px 20px #000;
box-shadow: 0px 0px 20px #000;
/*--CSS3 Rounded Corners--*/
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
img.btn_close {
float: right;
margin: -20 -20px 0 0;
}
/*--Making IE6 Understand Fixed Positioning--*/
*html #fade {
position: absolute;
}
*html .popup_block {
position: absolute;
}
</style>
</head>
<body>
{block:IfDisableRightClick}
<script language=JavaScript>
<!--
//Disable right click script III- By Renigade (renigade@mediaone.net)
//For full source code, visit http://www.dynamicdrive.com
var message="";
///////////////////////////////////
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if
(document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
// -->
</script>
{/block:IfDisableRightClick}
<div style="position:fixed; background-color: #fff; right:10px; top:25px; padding:4px; color: #000; border:1px solid #000; opacity:0.8; font-size:10px; z-index:222;"><a title="theme by Chloe"href="http://instathemes.tumblr.com/"><i class="fa fa-moon-o"></i></a></div>
<center>
<div id="container">
<div id="entries">
<!---------------EDIT SIDEBAR CONTENT HERE--------------->
<div id="sidebar">
<div class="blogtitle"><a href="/">{Title}</a></div>
{block:ifSidebarImage}<img src="{image:Sidebar Image}" width="190">{/block:ifSidebarImage}
<div class="description">{Description}</div>
<div class="links">
<a href="/" title="refresh">home</a><br>
<a href="#?w=500" rel="02" class="poplight" title="Mssg">Ask</a><br>
<a href="{text:Link One URL}" title="{text:Link One Title}">{text:Link One Title}</a><br>
{block:IfLinkTwo} <a href="{text:Link Two URL}" title="{text:Link Two Title}">{text:Link Two Title}</a><br>{/block:IfLinkTwo}
{block:IfLinkThree} <a href="{text:Link Three URL}" title="{text:Link Three Title}">{text:Link Three Title}</a><br>{/block:IfLinkThree}
</div>
</div>
{block:Posts}
<!---------------DO NOT DELETE block:ContentSource--------------->
{block:ContentSource}
<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
{/block:SourceLogo}
{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
{/block:ContentSource}
<div id="post">
<!---------------EDIT TEXT POSTS HERE--------------->
{block:Text}
<div class="text">
<div class="posttitle">{block:Title}{Title}{/block:Title}</div>
{Body}{block:IndexPage}<div class="permalink"><center><a href="{ReblogURL}">Reblog</a> |
<a href="{Permalink}">{NoteCountWithLabel}</a> | <a href="{Permalink}">{TimeAgo}</a></center>
</div>{/block:IndexPage}</div>
{/block:Text}
<!---------------EDIT LINK POSTS HERE--------------->
{block:Link}
<a href="{URL}"><div class="posttitle">{Name}</div></a>
{block:Description}{Description}{/block:Description}
{block:IndexPage}<div class="permalink"><center><a href="{ReblogURL}">Reblog</a> |
<a href="{Permalink}">{NoteCountWithLabel}</a> | <a href="{Permalink}">{{TimeAgo}</a></center>
</div>{/block:IndexPage}
{/block:Link}
<!---------------EDIT PHOTO POSTS HERE--------------->
{block:Photo}
{block:IndexPage}
<img src="{PhotoURL-250}" alt="{PhotoAlt}" width="250px"/>{/block:IndexPage}<div class="permalink"><center><a href="{ReblogURL}">Reblog</a> |
<a href="{Permalink}">{NoteCountWithLabel}</a> | <a href="{Permalink}">{TimeAgo}</a></center>
</div>{block:PermalinkPage}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />{/block:PermalinkPage}</a>
{/block:Photo}
<!---------------EDIT PHOTOSET POSTS HERE--------------->
{block:Photoset}
{block:IndexPage}{block:Photos}<a href="{Permalink}"><img src="{PhotoURL-500}" /></a>{/block:Photos}<div class="permalink"><center><a href="{ReblogURL}">Reblog</a> |
<a href="{Permalink}">{NoteCountWithLabel}</a> | <a href="{Permalink}">{TimeAgo}</a></center>
</div>{/block:IndexPage}
{block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
{/block:Photoset}
<!---------------EDIT QUOTE POSTS HERE--------------->
{block:Quote}
{Quote}{block:Source}
<div class="source">{Source}</div>{/block:Source}
{block:IndexPage}
<div class="permalink"><center><a href="{ReblogURL}">Reblog</a> |
<a href="{Permalink}">{NoteCountWithLabel}</a> | <a href="{Permalink}">{TimeAgo}</a></center>{/block:IndexPage}</div>
{/block:Quote}
<!---------------EDIT ANSWER POSTS HERE--------------->
{block:Answer}
<div class="ask"><span class="asker">{Asker}:</span> {Question}</div>
<div class="answer">{Answer}</div>
{block:IndexPage}
<div class="permalink"><center><a href="{ReblogURL}">Reblog</a> |
<a href="{Permalink}">{NoteCountWithLabel}</a> | <a href="{Permalink}">{TimeAgo}</a></center></div>{/block:IndexPage}
{/block:Answer}
<!---------------EDIT CHAT POSTS HERE--------------->
{block:Chat}
{block:Title}<div class="posttitle">{Title}</div>{/block:Title}
<div class="chat"><ul>{block:Lines}
<li class="person{UserNumber}">{block:Label}
<span class="label">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}</ul></div>{block:IndexPage}<div class="permalink"><center><a href="{ReblogURL}">Reblog</a> |
<a href="{Permalink}">{NoteCountWithLabel}</a> | <a href="{Permalink}">{TimeAgo}</a></center></div>
{/block:IndexPage}
{/block:Chat}
<!---------------EDIT AUDIO POSTS HERE--------------->
{block:Audio}
<div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>
{block:AlbumArt}
<img src="{AlbumArtURL}" class="cover" width="250px">
{/block:AlbumArt}
<div class="info"><div class="i"><span{block:TrackName} style="display: none;"{block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}</div><div class="i">by<span{block:Artist} style="display: none;"{block:Artist}>Unknown</span> {block:Artist}{Artist}{/block:Artist}</div></div>{block:IndexPage}<div class="permalink"><center><a href="{ReblogURL}">Reblog</a> |
<a href="{Permalink}">{NoteCountWithLabel}</a> | <a href="{Permalink}">{TimeAgo}</a></center></div>
{/block:IndexPage}
{/block:Audio}
<!---------------EDIT VIDEO POSTS HERE--------------->
{block:Video}
{block:IndexPage}<div class="video-container">{Video-250}</div>
<div class="permalink"><center><a href="{ReblogURL}">Reblog</a> |
<a href="{Permalink}">{NoteCountWithLabel}</a> | <a href="{Permalink}">{{TimeAgo}</a></center>/div>{/block:IndexPage}
{block:PermalinkPage}{Video-500}{/block:PermalinkPage}
{/block:Video}
<!---------------EDIT PERMALINK PAGE HERE--------------->
{block:PermalinkPage}
{block:Caption}{Caption}{/block:Caption}
<p>{block:Date} {Month} {DayofMonthWithSuffix}, {Year}{/block:Date} {block:NoteCount}, {NoteCountWithLabel}{/block:NoteCount} {block:RebloggedFrom} , (via <a href="{ReblogParentURL}">{ReblogParentName}</a>){/block:RebloggedFrom}
<div class="permapage">
<div style="margin-top:10px; margin-left:-10px;">{block:PostNotes}{PostNotes}{/block:PostNotes}</div>{/block:PermalinkPage}
</div>
{/block:Posts}
</div>
<!---------------DO NOT DELETE THIS--------------->
{block:IndexPage}
{block:Pagination}
<div id="pagination">
{block:NextPage}
<a id="nextPage" href="{NextPage}"></a>
{/block:NextPage}
{block:PreviousPage}
<a href="{PreviousPage}"></a>
{/block:PreviousPage}
</div>
{/block:Pagination}
{/block:IndexPage}
</center>
</body>
<div id="02" class="popup_block">
<Center><iframe frameborder="0" scrolling="yes" width="100%" height="190" src="http://tumblr.com/ask_form/{text:Username}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form">
</center></div>
</div></div></div></div></div></div></div></div></div></div></div>
</html>