создание наложенных сообщений на Tumblr

Я пытаюсь научиться создавать темы tumblr, но это было сложно. Я работаю над темой, которая показывает кнопки социальных сетей, когда вы наводите курсор на каждую фотографию, создавая оверлеи. Я не смог найти правильный способ сделать это для каждого сообщения. Это код, который я пробовал для фотографий:

{block:Posts} 
    {block:Photo}
        <div class="post photo smallbox" id="post-{PostID}">
         <img src="{PhotoURL-500}" alt="{PhotoAlt}" id="photo"/>
         <div class="wrapper">
             <div class="content">
                 <div class="likebutton">
                 {LikeButton size="100"}  
                 </div>
                 <div class="repostbutton">
                 {ReblogButton size="100"}   
                 </div>
                 <div class="line"></div>
                 <div class="shareBoxBtn">
                     <a href="http://twitter.com/intent/tweet?url={URLEncodedShortURL}" target="_blank">
                         <span class="shareBoxBtn share_twBtn" style="opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0);"></span>
                         <span class="shareBoxBtnHover share_twBtnHover" style="opacity: 0;"></span>
                     </a>
                     <a href="https://www.facebook.com/dialog/feed?app_id=221438161314294&link={URLEncodedPermalink}&redirect_uri={URLEncodedPermalink}" target="_blank">
                         <span class="shareBoxBtn share_fbBtn" style="opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0);"></span>
                         <span class="shareBoxBtnHover share_fbBtnHover" style="opacity: 0;"></span>
                     </a>
                     <a href="//pinterest.com/pin/create/button/?url={URLEncodedPermalink}&media={URLEncodedPhotoURL-500}" target="_blank">
                         <span class="shareBoxBtn share_pinBtn" style="opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0);"></span>
                         <span class="shareBoxBtnHover share_pinBtnHover" style="opacity: 0;"></span>
                     </a>
                 </div>   
             </div>
         </div>
        </div>
    {/block:Photo}
{/block:Posts}