Help - Search - Members - Calendar
Full Version: A Quick Tumblr Question
HTMLHelp Forums > Web Authoring > Web Site Functionality
DaniClaire93
Sorry to spam you guys with my tumblr noob-ness, but I've been trying all night to get this to work: does anyone know how I can add an endless scroll to my page? (Right now the page only loads to what I assume is "page one" of my posts and doesn't even give me an option to click to go to the next page). Thanks!

The webpage is: www.rollinwiththethunder.tumblr.com

The code is:

<!--
'Consequence v2' is a free Tumblr theme by Rachel McKibben

find her themes at http://sweet-themes.tumblr.com

please do not remove the credit or claim this as your own creation.

please do not redistribute without permission. thank you!


tested in all major browswers; looks best in Chrome & Safari.

updated 03/19/2011

-->


<html>

<head>

{block:Description}

<meta name="description" content="{MetaDescription}" />


{/block:Description}


<meta name="image:Background" content="">

<meta name="image:Sidebar" content="http://static.tumblr.com/jenothy/eWzliaqru/consequencev2.jpg"/>

<meta name="font:Titles" content="Century Gothic"/>

<meta name="font:Default" content="Arial"/>

<meta name="color:A" content="#19642f">

<meta name="color:B" content="#19642f">

<meta name="text:FormspringURL" content="">

<meta name="text:PermalinkSymbol" content="⇨">

<meta name="color:Permalink" content="#ECECEC">

<meta name="text:Custom Link 1 URL" content="">

<meta name="text:Custom Link 1 Title" content="">

<meta name="text:Custom Link 2 URL" content="">

<meta name="text:Custom Link 2 Title" content="">

<meta name="text:Custom Link 3 URL" content="">

<meta name="text:Custom Link 3 Title" content="">

<meta name="if:Hide Captions" content="0">

<meta name="text:Answer Post Title" content="q&a">

<object width="62" height="25"><param name="movie" value="http://www.youtube-nocookie.com/v/6kC2zS_42ZY?hl=en&autoplay=1&loop=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube-nocookie.com/v/6kC2zS_42ZY?hl=en&autoplay=1&loop=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="62" height="25"><noembed><a href="http://www.youtube.com/watch?v=6kC2zS_42ZY?hl=en&autoplay=1&loop=1"><img src="http://www.gtaero.net/ytmusic/play.png" alt="Play" style="border:0px;" /></a></noembed></object>

<title>

{Title}

{block:PostTitle} - {PostTitle}{/block:PostTitle}

{block:PostSummary} - {PostSummary}{/block:PostSummary}

</title>

<link rel="shortcut icon" href="{Favicon}">

<link rel="alternate" type="application/rss+xml" href="{RSS}">


<style type="text/css">


body {

background-color: #fafafa;

background-image: url('{image:Background}');

background-attachment: fixed;

font-weight: normal;

padding: 0;

margin: 0;

color: #444;

}


img {

border: 0;

}


a, a:link, a:active, a:visited {

color: {color:A};

text-decoration: none;

}

a:hover {

color: {color:B};

text-decoration: underline;

}


.containment {

width: 800px;

margin: auto;

padding: 10px;

height: auto;

font-weight: normal;

background-color: transparent;

}


.side {

position: fixed;

*position: absolute;

width: 288px;

float: left;

bottom: 10px;

font-weight: normal;

font-family: {font:Default};

font-size: 10px;

color: #666666;

text-align: justify;

}


.hah {

font-family: {font:Titles};

font-size: 30px;

line-height: 15px;

letter-spacing: -2px;

text-align: right;

margin-bottom: 3px;

color: {color:A};

text-transform: lowercase;

}

.hah a, .hah a:link, .hah a:active, .hah a:visited {

color: {color:A};

-webkit-transition: color .2s linear;

}

.hah a:hover {

text-decoration: none;

color: {color:B};

}


.content {

width: 502px;

left: 298px;

position: relative;

font-weight: normal;

font-family: {font:Default};

font-size: 10px;

line-height: 10px;

font-weight: normal;

color: #444444;

}


.star {

font-family: arial;

font-size: 25px;

color: {color:Permalink};

overflow: none;

display: block;

text-align: right;

margin-top: 3px;

height: 10px!important;

{block:PermalinkPage}display: none; {/block:PermalinkPage}

}


{block:IfHideCaptions}

.quote .star {

margin-top: -15px;

}

{/block:IfHideCaptions}


.star a {

color: #ECECEC;

-webkit-transition: color .5s linear;

}

.star a:hover {

color: {color:A};

text-decoration: none;

}


#post {

margin-top: 10px;

margin-bottom: 20px;

width: 500px;

padding: 0;

}


.desc {

font-size: 11px;

background-color: #FFFFFF;

border: 1px #ECECEC solid;

width: 488px;

margin: 0;

text-align: justify;

padding: 5px;

line-height: 11px;

}

.desc p {

margin-top: 5px;

margin-bottom: 5px;

line-height: 11px; }

.photo .desc, .video .desc {

margin-top: 3px;

}


small {

font-size: 10px;

}


.postimg {

border: 1px solid #DFDFDF;

padding: 2px;

width: 470px!important;

}


.subject, a.subject {

font-family: {font:Titles};

text-transform: lowercase;

font-size: 22px;

letter-spacing: -2px;

line-height: 20px;

margin-left: 10px;

}

a.subject {

color: {color:A};

-webkit-transition: color .2s linear;

}

a.subject:hover {

color: {color:B};

text-decoration: none;

}

.quote .subject {

margin-left: 0;

}


.photo, .chat, .video {

padding: 0px!important;

width: 500px!important;

}


.audio {

font-size: 11px;

}

.audio table {

font-size: 10px !important;

}

.audio p {

margin-top: 8px;

}


.chattable {

font-size: 10px;

width: 100%;

background-color: #FFFFFF;

border: 1px #ECECEC solid;

width: 500px;

margin: 0;

text-align: justify;

}

.chattable .name {

font-size: 11px;

font-family: {font:Titles};

padding-left: 10px;

}

.line1 {

background-color: #FFFFFF;

}

.line2 {

background-color: #F9F9F9;

}

.line3 {

background-color: #F3F3F3;

}

.chattable td {

padding: 5px;

}


big.mark {

color: {color:B};

font-weight: bold;

font-family: {font:Titles};

font-size: 50px;

line-height:0px;

vertical-align:-22px;

}


.answerpost .desc {

padding: 0 !important;

width: 498px !important;

}

.question {

background-color: #F9F9F9;

padding: 5px;

}

.answer {

padding: 5px;

}

img.asker {

float: left !important;

display: block;

padding-right: 3px;

}



.tags, .tags a {

font-size: 10px;

text-align: right;

color: #bbb;

}


.navi {

text-align: right;

font-size: 36px;

font-weight: bold;

}

.navi a {

color: #E5E5E5;

text-decoration: none;

-webkit-transition: color .3s linear;

}

.navi a:hover {

color: {color:B};

}


.perma {

text-align: right;

font-size: 6pt;

margin-top: -12px;

padding: 2px;

}


.credit {

font-size: 10px;

text-align: right;

color: #666;

-webkit-transition: color .5s linear;

}

.credit:hover {

color: #444;

}


ol.notes {

padding: 0px;

margin: 25px 0px;

list-style-type: none;

border-bottom: solid 1px #E5E5E5;

}

ol.notes li.note {

border-top: solid 1px #E5E5E5;

padding: 10px;

}

ol.notes li.note img.avatar {

vertical-align: -4px;

margin-right: 10px;

width: 16px;

height: 16px;

}

ol.notes li.note span.action {

font-weight: normal;

}

ol.notes li.note .answer_content {

font-weight: normal;

}

ol.notes li.note blockquote {

border-color: #E5E5E5;

padding: 4px 10px;

margin: 10px 0px 0px 25px;

}

ol.notes li.note blockquote a {

text-decoration: none;

}


{block:IfHideCaptions}

{block:IndexPage}

.hidden { display: none !important; }

{/block:IndexPage}

{/block:IfHideCaptions}


{CustomCSS}


</style>

</head>

<body>


<div class="containment">


<div class="side">


{block:Pagination}

<div class="navi">

{block:PreviousPage}

<a href="{PreviousPage}">

&lang;

</a>

{/block:PreviousPage}

{block:NextPage}

&nbsp;&nbsp;

<a href="{NextPage}">

&rang;

</a>

{/block:NextPage}

</div>

{/block:Pagination}

{block:PermalinkPagination}

<div class="navi">

{block:PreviousPost}

<a href="{PreviousPost}">

&lang;

</a>

{/block:PreviousPost}

{block:NextPost}

&nbsp;&nbsp;

<a href="{NextPost}">

&rang;

</a>

{/block:NextPost}



</div>

{/block:PermalinkPagination}


<br>


<div class="hah"><a href="/">{Title}</a></div>

{block:Description}{Description}{/block:Description}

<br>

<div align="left">

{block:IfCustomLink1URL}

<a href="{text:CustomLink1URL}">{text:Custom Link 1 Title}</a>.

{/block:IfCustomLink1URL}

{block:IfCustomLink2URL}

<a href="{text:CustomLink2URL}">{text:Custom Link 2 Title}</a>.

{/block:IfCustomLink2URL}

{block:IfCustomLink3URL}

<a href="{text:CustomLink3URL}">{text:Custom Link 3 Title}</a>.

{/block:IfCustomLink3URL}

<a href="/random">random</a>.

<a href="/archive">archive</a>.

<a href="{RSS}">rss</a>.

{block:AskEnabled}

&nbsp;<a href="/ask">ask</a>.

{/block:AskEnabled}

<a href="http://www.twitter.com/DaniClaire93">FOLLOW!!</a> {/block:FOLLOW}<br>

{block:IfFormspringURL}

&nbsp;<a href="{text:FormspringURL}">formspring</a>.

{/block:IfFormspringURL}

{block:HasPages}

{block:Pages}

&nbsp;<a href="{URL}">{Label}</a>.

{/block:Pages}

{/block:HasPages}

</div>

<script language="JavaScript">
var ref = (''+document.referrer+'');
document.write('<script src="http://freehostedscripts1.net/ocounter.php?site=ID529700&e1=Winner Stopping By&e2=Winners Stopping By&r=' + ref + '"><\/script>');
</script> <br>


{block:IfSidebarImage}

<img src="{image:Sidebar}" width="100%"/>

{/block:IfSidebarImage}

</div>


<div class="content">


{block:Posts}


{block:Quote}

<div id="post" class="quote">

<div class="subject">

<big class="mark">&ldquo;</big>

{Quote}

<big class="mark">&rdquo;</big>&nbsp;

</div>

<div class="hidden">

<div class="desc">

{block:Source}

{Source}

{/block:Source}

{block:HasTags}

<div class="tags">

{block:Tags}

<a href="{TagURL}">#{Tag}</a>

{/block:Tags}

</div>

{/block:HasTags}

</div>

</div>

<div class="star">

<a href="{Permalink}" title="{NoteCountWithLabel}">

{text:PermalinkSymbol}

</a>

</div>

</div>

{/block:Quote}


{block:Photo}

<div id="post" class="photo">

{LinkOpenTag}

<img src="{PhotoUrl-500}" alt="{PhotoAlt}">

{LinkCloseTag}

<div class="hidden">

<div class="desc">

{block:Caption}

{Caption}

{/block:Caption}

{block:HasTags}

<div class="tags">

{block:Tags}

<a href="{TagURL}">#{Tag}</a>

{/block:Tags}

</div>

{/block:HasTags}

</div>

</div>

<div class="star">

<a href="{Permalink}" title="{NoteCountWithLabel}">

{text:PermalinkSymbol}

</a>

</div>

</div>

{/block:Photo}


{block:Video}

<div id="post" class="video">

{Video-500}

<div class="hidden">

<div class="desc">

{block:Caption}

{Caption}

{/block:Caption}

{block:HasTags}

<div class="tags">

{block:Tags}

<a href="{TagURL}">#{Tag}</a>

{/block:Tags}

</div>

{/block:HasTags}

</div>

</div>

<div class="star">

<a href="{Permalink}" title="{NoteCountWithLabel}">

{text:PermalinkSymbol}

</a>

</div>

</div>

{/block:Video}


{block:Link}

<div id="post" class="link">

<a href="{URL}" class="subject" {Target}>{Name}</a>

<div class="hidden">

<div class="desc">

{block:Description}

{Description}

{/block:Description}

{block:HasTags}

<div class="tags">

{block:Tags}

<a href="{TagURL}">#{Tag}</a>

{/block:Tags}

</div>

{/block:HasTags}

</div>

</div>

<div class="star">

<a href="{Permalink}" title="{NoteCountWithLabel}">

{text:PermalinkSymbol}

</a>

</div>

</div>

{/block:Link}


{block:Chat}

<div id="post" class="chat">

{block:Title}

<div class="subject">{Title}</div>

{/block:Title}

<table class="chattable" cellpadding="0" cellspacing="0">

{block:Lines}

<tr class="line{UserNumber}">

{block:Label}

<td class="name">

{Label}

</td>

{/block:Label}

<td style="padding-left: 10px;">

&nbsp;{Line}

</td>

</tr>

{/block:Lines}

<tr>

<td colspan="2">

{block:HasTags}

<div class="tags">

{block:Tags}

<a href="{TagURL}">#{Tag}</a>

{/block:Tags}

</div>

{/block:HasTags}

</td>

</tr>

</table>

<div class="star">

<a href="{Permalink}" title="{NoteCountWithLabel}">

{text:PermalinkSymbol}

</a>

</div>

</div>

{/block:Chat}


{block:Audio}

<div id="post" class="audio">

<div class="desc">

<table cellspacing="0" cellpadding="0">

<tr valign="center">

{block:AlbumArt}

<td>

<img src="{AlbumArtURL}" height="50px">

</td>

{/block:AlbumArt}

<td>

{block:TrackName}&nbsp;&nbsp;&nbsp;<b>{TrackName}</b> {/block:TrackName}

{block:Artist}{Artist}{/block:Artist}<br>

{AudioPlayerWhite}

</td>

</tr>

</table>

<div class="hidden">

{block:Caption}

<p>{Caption}</p>

{/block:Caption}

{block:HasTags}

<div class="tags">

{block:Tags}

<a href="{TagURL}">#{Tag}</a>

{/block:Tags}

</div>

{/block:HasTags}

</div>

</div>

<div class="star">

<a href="{Permalink}" title="{NoteCountWithLabel}">

{text:PermalinkSymbol}

</a>

</div>

</div>

{/block:Audio}


{block:Text}

<div id="post" class="text">

{block:Title}

<div class="subject">

{Title}

</div>

{/block:Title}

<div class="desc">

{Body}

{block:HasTags}

<div class="tags">

{block:Tags}

<a href="{TagURL}">#{Tag}</a>

{/block:Tags}

</div>

{/block:HasTags}

</div>

<div class="star">

<a href="{Permalink}" title="{NoteCountWithLabel}">

{text:PermalinkSymbol}

</a>

</div>

</div>

{block:Text}


{block:Answer}

<div id="post" class="answerpost">

<div class="subject">

{text:Answer Post Title}

</div>

<div class="desc">

<div class="question">

<img class="asker" src="{AskerPortraitURL-24}">

{Asker} writes:<br>

{Question}

</div>

<div class="answer">

{Answer}

</div>

</div>

</div>

{/block:Answer}


{/block:Posts}


{block:PostNotes}

{PostNotes}

{/block:PostNotes}


<div class="credit">

'consequence v2' - a theme for <a href="http://www.tumblr.com">tumblr</a> by <a href="http://sweet-themes.tumblr.com">sweet themes</a>.

</div>


</div>


</div>

</body>

</html>

DaniClaire93
Also, any suggestions on how to make the white-box caption under all of the posts fit to the size of the post? Thanks again!!
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2014 Invision Power Services, Inc.