Tumblr HTML Help needed.


#1

Hi Folks…

About me: I am really primitive IT-knowledge-less person and a simple mortal - and I need Your IT GURU help. I have 2 issues.

No.1
I wanted to customise a bit my Tumblr theme. I want to add to my theme some features from the other theme. Here are the details of the issue:
this is the Club Monaco theme -> http://cm-theme.tumblr.com/ ->
(scroll it down where the pictures are)

-> I want to have that white box with the “like, reblog, facebook, twitter, pinterest, share” buttons on my posts. I have the HTML of the Club Monaco theme, and I have my HTML.
Can somebody please alter my HTML and paste it here, so that when I will apply it - the white boxes with the buttons will appear on my posts(photos, videos, audio, text) ???
My Tumblr: http://surfthemuse.tumblr.com/

No.2

When I click on any photo/post of mine - it redirects me on strange page with dark background (http://surfthemuse.tumblr.com/image/65693820692) and only after a click on the TOP/LEFT icon it redirects onto a clean outline (http://surfthemuse.tumblr.com/post/65693820692/yohji-yamamoto-1987).
Can You alter the HTML - so after the initial first click on the post it goes directly to the clean outlined page???

I am already thankful to anybody who took time to read this, and would more than appreciate if somebody could help with the HTML… I believe (I guess) its not that complicated for somebody who is familiar with the coding =)


#2

THIS IS THE HTML of CLUB MONACO THEME:


{Title} {block:Description} {/block:Description} {CustomCSS}
<!-- Pinterest -->
<script type="text/javascript">
  (function(d){
  var f = d.getElementsByTagName('SCRIPT')[0], p = d.createElement('SCRIPT');
  p.type = 'text/javascript';
  p.async = true;
  p.src = '//assets.pinterest.com/js/pinit.js';
  f.parentNode.insertBefore(p, f);
  }(document));
</script>

<meta name="image:Header" content=""/>

<meta name="text:Google Analytics" content=""/>
{block:IfGoogleAnalytics}
<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', '{text:Google Analytics}']);
  _gaq.push(['_trackPageview']);

  (function() {
  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>
{/block:IfGoogleAnalytics}

<meta name="if:Hide Club Monaco Logo" content="0"/>
  {block:IndexPage}
  <div class="row"><div class="span22 offset1"><div class="line-break"></div></div></div>
  {/block:IndexPage}

  <div class="row" id="feed">
    <div class="{block:IndexPage}span22 offset1{/block:IndexPage}" id="posts">
      {block:TagPage}<h2 class="tag_title">{Tag}</h2>{/block:TagPage}
      {block:IndexPage}<h2 class="latest_title">The Latest</h2>{/block:IndexPage}
      <div id="posts-container">

        {block:Posts}
        <div class="post masonry_visible {PostType} {TagsAsClasses} {block:Photoset}photoset{/block:Photoset}" {block:ContentSource}data-source="{PlaintextSourceURL}"{/block:ContentSource} data-permalink="{Permalink}">
          <div class="attachment">
            {block:Photo}

            {block:IndexPage}
            <a href="{Permalink}">
            <img src="{PhotoURL-500}" alt="{PhotoAlt}" data-highres="{PhotoURL-HighRes}" />
            </a>
            {/block:IndexPage}

            {block:PermalinkPage}
            {LinkOpenTag}
            <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />
            {LinkCloseTag}
            {/block:PermalinkPage}

            {LinkCloseTag}
            {/block:Photo}

            {block:Photoset}

            {block:IndexPage}
            {block:Photos}
            <a href="{Permalink}">
            <img src="{PhotoURL-500}" alt="{PhotoAlt}" data-highres="{PhotoURL-HighRes}" data-caption="{PlaintextCaption}" />
            </a>
            {block:Photos}
            {/block:IndexPage}

            {block:PermalinkPage}
            {Photoset-700}
            {/block:PermalinkPage}
            {/block:Photoset}

            {block:Video}
            {Video-500}
            {/block:Video}

            {block:Audio}
            {block:AudioEmbed}{AudioEmbed-500}{/block:AudioEmbed}
            {AudioPlayer}
            {/block:Audio}

            {block:Quote}
            <div class="quote_body">{Quote}</div>
            {block:Source}<div class="quote_source">{Source}</div>{/block:Source}
            {/block:Quote}


            <div class="social clearfix"><ul class="unstyled">
              <li class="like">{LikeButton color="black" size="13"}</li>
              <li><a class="reblog" href="{ReblogURL}">r</a></li>
              <li><a class="facebook" href="https://www.facebook.com/dialog/feed?app_id=221438161314294&link={URLEncodedPermalink}&redirect_uri={URLEncodedPermalink}">f</a></li>
              <li><a class="twitter" href="http://twitter.com/intent/tweet?url={URLEncodedShortURL}">t</a></li>
              {block:Photo}
              <li><a class="pinterest" href="//pinterest.com/pin/create/button/?url={URLEncodedPermalink}&media={URLEncodedPhotoURL-500}" data-pin-do="buttonBookmar">p</a></li>
              {/block:Photo}
              <li class="permalink_li"><a class="permalink" href="{Permalink}">l</a></li>
            </ul></div>

          </div>
          <a class="meta" href="{Permalink}">
            {block:Date}{ShortMonth} {DayOfMonth}, {Year}{/block:Date}
            {block:NoteCount}/ {NoteCountWithLabel}{/block:NoteCount}
          </a>
          <div class="body">
            {block:Text}
            {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
            {Body}
            {/block:Text}

            {block:Chat}
            {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}

            <ul class="chat_transcript unstyled">
              {block:Lines}
              <li class="{Alt} user_{UserNumber}">
                {block:Label}
                <span class="label">{Label}</span>
                {/block:Label}
                {Line}
              </li>
              {/block:Lines}
            </ul>
            {/block:Chat}

            {Caption}

            {block:PermalinkPage}
            {block:ContentSource}
            <p>
              <a href="{SourceURL}">
                {lang:Source}:
                {block:SourceLogo}
                <img src="{BlackLogoURL}" width="{LogoWidth}"
                     height="{LogoHeight}" alt="{SourceTitle}" />
                {/block:SourceLogo}
                {block:NoSourceLogo}
                {SourceTitle}
                {/block:NoSourceLogo}
              </a>
            </p>
            {/block:ContentSource}
            {/block:PermalinkPage}
          </div>

          {block:HasTags}
          <div class="tags">
            {block:Tags}
            <a class="tag" href="{TagUrl}" data-tag="{PlaintextTag}">#{Tag}</a>
            {/block:Tags}
          </div>
          {/block:HasTags}

          {PostNotes}

        </div>
        {/block:Posts}

      </div>
    </div>
  </div>

  {block:Pagination}
  <div class="row pagination">
    <div class="span22 offset2">
      {block:PreviousPage}
      <a href="{PreviousPage}" class="previous">Previous</a>
      {/block:PreviousPage}

      {block:NextPage}
      <a href="{NextPage}" class="next">Next</a>
      {/block:NextPage}
    </div>
  </div>
  {/block:Pagination}

  {block:IfNotHideClubMonacoLogo}
  <div class="floating_logo">
    Theme by
    <a href="http://clubmonaco.com">Club Monaco</a>
  </div>
  {/block:IfNotHideClubMonacoLogo}

</div>

<script src="http://static.tumblr.com/i21wc39/hL6mn3w8d/application.js" type="text/javascript"></script>

<script type="text/html" class="template" id="slideshow_template">

  <div class="row" id="feature">
    <div class="span2 slideshow-header">
      <img src="{{ slideshow.cropped_image }}" alt="{{ slideshow.name }}" />
    </div>
    <div class="span22" id="feature-slideshow">
      <div id="slideshow" class="carousel slide">
        <div class="carousel-inner">
          {{#slides}}
          <div class="item">
            {{#theme_garden}}<a href="{{ url }}"><div class="centering_table"><div class="vertical_centering">{{/theme_garden}}
            <img src="{{ cropped_image }}" />
            {{#theme_garden}}</div></div></a>{{/theme_garden}}

            <div class="info">

              <div class="centering"><div class="copy">
                {{ copy }}
                <br/><br/><a href="{{ url }}" class="slide_link">{{ link_title }}</a>
              </div></div>

            </div>
          </div>
          {{/slides}}
        </div>
      </div>
    </div>
  </div>

  <div class="row">
    <div class="span2"></div>
    <div class="span22">
        <ol class="carousel-dots clearfix unstyled">
        </ol>
    </div>
  </div>
</script>

<script type="text/html" class="template" id="tag_nav_template">
  <div class="tag_nav_container clearfix">
    <ul class="tag_nav unstyled">
      <li class="view_all"><a href="#">View All</a></li>
      <li><a href="/tagged/womens" data-tag="womens">Womens</a></li>
      <li><a href="/tagged/mens" data-tag="mens">Mens</a></li>
      <li><a href="/tagged/accessories" data-tag="accessories">Accessories</a></li>
      <li><a href="/tagged/photographers-and-cast" data-tag="photographers_and_cast">Photographers and Cast</a></li>
    </ul>
  </div>
</script>

<script type="text/html" class="template" id="photo_lightbox_template">
  <div class="lightbox_overlay"></div>
  <div class="lightbox">
    <a href="#" class="close">Close</a>
    <div class="padding">
      <div class="scroller">
        {{&content}}
      </div>
    </div>
  </div>
</script>

<script type="text/javascript">
  $(document).ready(function() {
  $("body").clubMonaco({themeGarden: true});
  });
</script>

AND THIS IS MY CUSTOMISED THEME SO FAR:


{Title}{block:PostSummary} - {PostSummary}{/block:PostSummary} {block:Description}{/block:Description}
<style type="text/css">
  body, #search input {font-family:{font:Page}}
  body {color:{color:Page font};background-color:{color:Page background};{block:ifBackgroundImage}background-image:url('{image:Background}');{/block:ifBackgroundImage}{block:ifNotStretchedBackgroundImage}{block:ifFixedBackgroundImage}background-attachment:fixed;{/block:ifFixedBackgroundImage}{/block:ifNotStretchedBackgroundImage}{block:ifStretchedBackgroundImage}background-attachment:fixed;background-size:100% 100%;{/block:ifStretchedBackgroundImage}}
  a {color:{color:Link}}
  blockquote, #top, #search input, .the-border, #foot-nav {border-color:{color:Border}}
  {block:ifNotTransparentPostBackground}.post {background-color:{color:Post background}}{/block:ifNotTransparentPostBackground}
  .text .title, .the-quote, .the-link a, .chat .title, .asked {color:{color:Title};font-family:{font:Title}}
  .album-art, .audio-meta li {background-color:{color:No album art background}}
  #toTop {background-image:url('{block:ifWhiteUpArrow}http://static.tumblr.com/eatauj5/bFhll9tq4/arrow-up-white.png{/block:ifWhiteUpArrow}{block:ifNotWhiteUpArrow}http://static.tumblr.com/eatauj5/Wupll45l8/arrow-up.png{/block:ifNotWhiteUpArrow}')}
  #index .meta, .caption-outer {background-color:{color:Meta background}}
  #index .meta a, .caption-inner {color:{color:Meta font}}
  {CustomCSS}
</style>
<!-- Pinterest -->
<script type="text/javascript">
  (function(d){
  var f = d.getElementsByTagName('SCRIPT')[0], p = d.createElement('SCRIPT');
  p.type = 'text/javascript';
  p.async = true;
  p.src = '//assets.pinterest.com/js/pinit.js';
  f.parentNode.insertBefore(p, f);
  }(document));
</script>
<script type="text/javascript">
  var tessellate = {
	search: '{lang:Search}',
	analytics: {block:ifGoogleAnalyticsID}true{/block:ifGoogleAnalyticsID}{block:ifNotGoogleAnalyticsID}false{/block:ifNotGoogleAnalyticsID},
	infscr: {block:ifInfiniteScroll}true{/block:ifInfiniteScroll}{block:ifNotInfiniteScroll}false{/block:ifNotInfiniteScroll},
	animations: {block:ifEnableAnimations}true{/block:ifEnableAnimations}{block:ifNotEnableAnimations}false{/block:ifNotEnableAnimations},
	fadein: {block:ifFadeInFirstPage}true{/block:ifFadeInFirstPage}{block:ifNotFadeInFirstPage}false{/block:ifNotFadeInFirstPage}
  }
</script>
{block:ifGoogleAnalyticsID}<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', '{text:Google Analytics ID}']);
  _gaq.push(['_trackPageview']);

  (function() {
	var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
	ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
	var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>{/block:ifGoogleAnalyticsID}
{block:IndexPage}<script type="text/javascript" src="http://assets.tumblr.com/javascript/tumblelog.js"></script>{/block:IndexPage}
<script type="text/javascript" src="http://static.tumblr.com/eatauj5/aBHly2e80/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/eatauj5/832lz70q4/tessellate.2.1c.min.js"></script>
{block:ifHeaderImage}
{Title}
{/block:ifHeaderImage}
{block:ifNotShowDescriptionUnderLinks}{block:ifShowDescriptionOverLinks}{block:Description}
{Description}
{/block:Description}{/block:ifShowDescriptionOverLinks}{/block:ifNotShowDescriptionUnderLinks}
	<div id="top-nav">
	  <ul id="links" class="{block:ifShowSearchBar}capped{/block:ifShowSearchBar} {block:ifNotShowHeaderSlashes}unslashed{/block:ifNotShowHeaderSlashes}">
		{block:ifNotHeaderImage}{block:ifShowTitle}<li id="title"><a href="/">{Title}</a><span class="s d"> &#47;&#47; </span></li>{/block:ifShowTitle}{/block:ifNotHeaderImage}
		{block:ifNotShowDescriptionUnderLinks}{block:ifNotShowDescriptionOverLinks}{block:Description}<li id="description">{Description}<span class="s d"> &#47;&#47; </span></li>{/block:Description}{/block:ifNotShowDescriptionOverLinks}{/block:ifNotShowDescriptionUnderLinks}
		<li><a href="/archive">{lang:Archive}</a></li>
		{block:HasPages}{block:Pages}<li><span class="s"> &#47; </span><a href="{URL}">{Label}</a></li> {/block:Pages}{/block:HasPages}
		{block:AskEnabled}<li><span class="s"> &#47; </span><a href="/ask">{AskLabel}</a></li>{/block:AskEnabled}
		{block:SubmissionsEnabled}<li><span class="s"> &#47; </span><a href="/submit">{SubmitLabel}</a></li>{/block:SubmissionsEnabled}
		{block:ifShowRSS}<li><span class="s"> &#47; </span><a href="{RSS}">{lang:RSS}</a></li>{/block:ifShowRSS}
		<li><span class="s"> &#47; </span><a href="http://www.tumblr.com/theme/30524" rel="nofollow">Theme</a></li>
	  </ul>

	  {block:ifShowSearchBar}
	  <form action="/search" method="get" name="search-form" id="search">
		<input type="text" name="q" value="{lang:Search}" />
	  </form>
	  {/block:ifShowSearchBar}
	</div>

	{block:ifShowDescriptionUnderLinks}{block:Description}
	<div id="description">
	  {Description}
	</div>
	{/block:Description}{/block:ifShowDescriptionUnderLinks}
  </div>

  <div id="content" class="{block:ifBorderAroundIndexPosts}border-index-post{/block:ifBorderAroundIndexPosts} {block:ifBorderAroundPermalinkContent}border-perm-content{/block:ifBorderAroundPermalinkContent} {block:ifBorderAroundPermalinkMeta}border-perm-meta{/block:ifBorderAroundPermalinkMeta}">
	{block:Posts}
	<div {block:Date}id="post-{PostID}"{/block:Date} class="post {block:Text}text {/block:Text}{block:Quote}quote {/block:Quote}{block:Link}link {/block:Link}{block:Chat}chat {/block:Chat}{block:Answer}answer {/block:Answer}{block:Photo}photo not-{/block:Photo}{block:Photoset}photoset not-{/block:Photoset}{block:Audio}audio not-{/block:Audio}{block:Video}video not-{/block:Video}wordy {block:Date}not-{/block:Date}page {block:IndexPage}{block:ifFadeInFirstPage}invisible{/block:ifFadeInFirstPage} {block:Photo}{block:Post7}{block:ifLarger7thPhoto}wide{/block:ifLarger7thPhoto}{/block:Post7}{block:Post14}{block:ifLarger14thPhoto}wide{/block:ifLarger14thPhoto}{/block:Post14}{/block:Photo}{block:Video}wide{/block:Video} transition-opacity{/block:IndexPage}">
	  {block:IndexPage}{block:ifMobileCompatibility}<a href="{Permalink}" class="mobile-shield"></a>{/block:ifMobileCompatibility}{/block:IndexPage}
	  <div class="content-block left-block the-border">
		<div class="post-content the-border">
		  {block:Text}
		  {block:Title}<h2 class="title">{Title}</h2>{/block:Title}
		  {body}
		  {/block:Text}
  • {LikeButton color="black" size="13"}
  • r
  • f
  • t
  • {block:Photo}
  • p
  • {/block:Photo}
  • l
		  {block:Photo}
		  <div class="the-photo">
			{block:IndexPage}{LinkOpenTag}<img src="{block:Post1}{PhotoURL-250}{/block:Post1}{block:Post2}{PhotoURL-250}{/block:Post2}{block:Post3}{PhotoURL-250}{/block:Post3}{block:Post4}{PhotoURL-250}{/block:Post4}{block:Post5}{PhotoURL-250}{/block:Post5}{block:Post6}{PhotoURL-250}{/block:Post6}{block:Post7}{block:ifLarger7thPhoto}{PhotoURL-500}{/block:ifLarger7thPhoto}{block:ifNotLarger7thPhoto}{PhotoURL-250}{/block:ifNotLarger7thPhoto}{/block:Post7}{block:Post8}{PhotoURL-250}{/block:Post8}{block:Post9}{PhotoURL-250}{/block:Post9}{block:Post10}{PhotoURL-250}{/block:Post10}{block:Post11}{PhotoURL-250}{/block:Post11}{block:Post12}{PhotoURL-250}{/block:Post12}{block:Post13}{PhotoURL-250}{/block:Post13}{block:Post14}{block:ifLarger14thPhoto}{PhotoURL-500}{/block:ifLarger14thPhoto}{block:ifNotLarger14thPhoto}{PhotoURL-250}{/block:ifNotLarger14thPhoto}{/block:Post14}{block:Post15}{PhotoURL-250}{/block:Post15}" alt="{PhotoAlt}" />{LinkCloseTag}{/block:IndexPage}
			{block:PermalinkPage}{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />{LinkCloseTag}{/block:PermalinkPage}
		  </div>
		  {/block:Photo}

		  {block:Photoset}
		  <div class="the-photoset layout{PhotosetLayout}">
			{block:IndexPage}{Photoset-250}{/block:IndexPage}
			{block:PermalinkPage}<!--
			-->{block:Photos}<span class="photoset-image">
			  <a href="{PhotoURL-HighRes}"><img src="{PhotoURL-500}" /></a>
			  {block:Caption}<span class="caption-outer">
				<span class="caption-inner">{Caption}</span>
			  </span>{/block:Caption}
			</span>{/block:Photos}<!--
			-->{/block:PermalinkPage}
		  </div>
		  {/block:Photoset}

		  {block:Quote}
		  <h2 class="the-quote">{Quote}</h2>
		  {block:Source}<div class="quote-source">&#8212; {Source}</div>{/block:Source}
		  {/block:Quote}

		  {block:Link}
		  <h2 class="the-link"><a href="{URL}" {Target}>{Name}</a></h2>
		  {block:Description}{Description}{/block:Description}
		  {/block:Link}

		  {block:Chat}
		  {block:Title}<h2 class="title">{Title}</h2>{/block:Title}
		  <ul class="the-chat">
			{block:Lines}<li class="{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}
		  </ul>
		  {/block:Chat}

		  {block:Audio}
		  <div class="album-art">
			<div class="audio-circle"><div class="the-audio hideflash">{AudioPlayerBlack}</div></div>
			{block:AlbumArt}<img src="{AlbumArtURL}" class="the-album-art" alt="" />{/block:AlbumArt}
		  </div>
		  {block:PermalinkPage}
		  <ul class="audio-meta">
			{block:TrackName}<li class="trackname">{TrackName}</li>{/block:TrackName}
			{block:Artist}<li class="artist">{Artist}</li>{/block:Artist}
			{block:Album}<li class="album">{Album}</li>{/block:Album}
		  </ul>
		  {/block:PermalinkPage}
		  {/block:Audio}

		  {block:Video}
		  <div class="the-video hideflash">{Video-500}</div>
		  {/block:Video}

		  {block:Answer}
		  <h2 class="asked"><span class="asker">{lang:Asker asked}</span>: <span class="question">{Question}</span></h2>
		  {Answer}
		  {/block:Answer}

		  {block:PermalinkPage}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
		</div> <!-- /.post-content -->
	  </div> <!-- /.left-block -->

	  {block:Date}
	  <div class="content-block right-block">
		<div class="meta the-border transition-height">
		  <a href="{Permalink}" title="{lang:Permalink}" class="permalink">{NoteCount} &hearts; {block:IndexPage}{block:ifShowDateOnIndexPage} <span class="s">&#47;</span> {block:ifContextualTimeOnIndexPage}{TimeAgo}{/block:ifContextualTimeOnIndexPage}{block:ifNotContextualTimeOnIndexPage}{block:ifEuropeanTimeFormat}{DayOfMonth} {Month}, {Year}{/block:ifEuropeanTimeFormat}{block:ifNotEuropeanTimeFormat}{Month} {DayOfMonth}, {Year}{/block:ifNotEuropeanTimeFormat}{/block:ifNotContextualTimeOnIndexPage}{/block:ifShowDateOnIndexPage}{/block:IndexPage}</a>
		  {block:PermalinkPage} <span class="s">&#47;</span> {block:ifEuropeanTimeFormat}{DayOfMonth} {Month}, {Year}{/block:ifEuropeanTimeFormat}{block:ifNotEuropeanTimeFormat}{Month} {DayOfMonth}, {Year}{/block:ifNotEuropeanTimeFormat}
		  {block:ContentSource} <span class="s">&#47;</span> <span class="source-label">{lang:Source}:</span> <a href="{SourceURL}">{SourceTitle}</a>{/block:ContentSource}
		  {block:RebloggedFrom}<!--{lang:Reblogged from ReblogParentName}-->{/block:RebloggedFrom}

		  {block:HasTags}
		  <ul class="tagged">
			<li class="tag-label">{lang:Tagged}:</li>
			{block:Tags}<li class="tag"><a href="{TagURL}">{Tag}</a><span>, </span></li>{/block:Tags}
		  </ul>
		  {/block:HasTags}{/block:PermalinkPage}
		</div>

		{block:ifShowNotesOnPermalinkPage}{block:PostNotes}{PostNotes}{/block:PostNotes}{/block:ifShowNotesOnPermalinkPage}
	  </div>
	  {/block:Date}
	</div> <!-- /.post -->
	{/block:Posts}

	{block:NoSearchResults}
	<div id="no-results" class="post text wordy page opaque">
	  <div class="left-block the-border">
		<div class="post-content">
		  <h2 class="title">{lang:No posts found}</h2>
		  <p>{lang:Sorry no search results found}</p>
		</div>
	  </div>
	</div>
	{/block:NoSearchResults}
  </div> <!-- /#content -->

  {block:Pagination}
  <ul id="foot-nav">
	{block:PreviousPage}<li class="prev"><a href="{PreviousPage}">&larr; {lang:Newer}</a></li>{/block:PreviousPage}
	{block:JumpPagination length="5"}
	{block:CurrentPage}<li class="current-page"><span>{PageNumber}</span></li>{/block:CurrentPage}
	{block:JumpPage}<li class="jump-page"><a href="{URL}">{PageNumber}</a></li>{/block:JumpPage}
	{/block:JumpPagination}
	{block:NextPage}<li class="next"><a href="{NextPage}">{lang:Older} &rarr;</a></li>{/block:NextPage}
  </ul>
  {/block:Pagination}
  {block:ifEnablePermalinkPagination}{block:PermalinkPagination}
  <ul id="foot-nav">
	{block:NextPost}<li class="next"><a href="{NextPost}">&larr; {lang:Newer}</a></li>{/block:NextPost}
	{block:PreviousPost}<li class="prev"><span class="s"> / </span><a href="{PreviousPost}">{lang:Older} &rarr;</a></li>{/block:PreviousPost}
  </ul>
  {/block:PermalinkPagination}{/block:ifEnablePermalinkPagination}
</div> <!-- /#container -->

{block:ifInfiniteScroll}{block:IndexPage}<div id="loading"></div>{/block:IndexPage}{/block:ifInfiniteScroll}

#3

Wow that’s a lot of code!

Problem one is just a javascript effect that you need to assign to your images. Google social image hover and there will be tutorials or plugins

Problem2 is that it looks as if by default the link is set to send you to the gallery so you just need to edit (either each item or potentially the top line code for the theme) to go to the post page first.

None of it is overly difficult but hard to explain in a forum. If you are not comfortable you can always get a freelancer to help you. Good luck


#4

P.s it has a bit of a low rating but the code does not look too bad so I would suggest you check out http://codecanyon.net/item/social-image-hover-for-jquery/2996827


#5

Thanks Charlie4282 for the reply! :slight_smile: I will try to broaden my knowledge))) the link u sent is quite helpful, thanks a lot)))


#6

hmm …
i kind of failed implementing your code @LMary18
and since the club monaco theme is by far my favorite theme on whole tumblr
i would really love to me some small modifications
like color, positions etc
could you help me with that?

thx a lot
mumu