The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
 Reply to this topicStart new topic
> Help to my Tumblr theme code
phigom
post Mar 18 2013, 09:22 PM
Post #1





Group: Members
Posts: 2
Joined: 18-March 13
Member No.: 18,867
Hello. Im here because i begin the HTML code.
Here you got my tumblr : silver-hvze.tumbr.com
I would change my circle portrait picture to square and Add a title in top-center of my headpage.
I would like too change my icon. i follow the instructions on this link : http://tools.dynamicdrive.com/favicon/ but it dosnt work. I would like this picture http://www.therockymountaingoat.com/wp-con..._CC_2014359.jpg

Here, there are my tumblr code :
CODE
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<!--
posters theme by ville noire //

-->
<title>{Title}</title>

<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}
<meta name="description" content="{MetaDescription}" />
{/block:Description}


<meta name="color:Text" content="#000000"/>
<meta name="color:Links" content="#000000"/>
<meta name="color:Accent" content="#E9E9E9"/>
<meta name="color:Hover" content="#000000"/>
<meta name="color:Background" content="#ffffff"/>
<meta name="color:header" content="#f7f7f7"/>

<meta name="if:Show Icon" content="0"/>

<meta name="if:Uppercase blogtitle" content="0"/>
<meta name="if:image shadows" content="0" />
<meta name="if:show captions" content="0"/>
<meta name="text:blogtitle size" content="19" />
<meta name="text:post font size" content="9" />
<meta name="font:body" content="courier new" />
<meta name="font:blogtitle" content="courier new" />
<meta name="font:nav links" content="courier new" />
<meta name="if:two columns" content="0" />
<meta name="text:Custom Link One" content="" />
<meta name="text:Custom Link One Title" content="" />
<meta name="text:Custom Link Two" content="" />
<meta name="text:Custom Link Two Title" content="" />
<meta name="text:Custom Link Three" content="" />
<meta name="text:Custom Link Three Title" content="" />
<meta name="text:Custom Link Four" content="" />
<meta name="text:Custom Link Four Title" content="" />
<meta name="text:Custom Link Five" content="" />
<meta name="text:Custom Link Five Title" content="" />

<script type="text/javascript" src="http://static.tumblr.com/misqj4e/k3Om6u289/adam.js"></script>

<style type="text/css">

iframe#tumblr_controls {
    top: 0% !important;
    right:0% !important;
    position: fixed !important;
    }

body {
    margin:auto;color:{color:text};
    font-family:{font:body};
    font-size:9px;
    background-color:{color:background};
    line-height:11px;
    }

a {
    color: {color:Links};
    text-decoration: none;
    }

a:hover {
    {color:Hover};
    -webkit-transition-duration: .5s;
    }
    
.caption {
    margin-top:5px;
    margin-bottom:10px;
    }

.content {
    margin:auto;
    background-color: {color:center};
    width:900px;
    {block:iftwocolumns}
    width:660px;
    {/block:iftwocolumns}
    padding-top:10px;
    height:100%;
    }

.post{
    {block:indexpage}
    width:250px;
    margin:25px;
    {block:iftwocolumns}
    margin:15px;
    width:300px;
    {/block:iftwocolumns}
    {/block:indexpage}
    {block:permalinkpage}
    width:500px;
    text-align:left;
    margin:auto;
    {/block:permalinkpage}
    float:left;
    position:relative;
    font-size:{text:post font size}px;
    font-color:{color:text};
    }

.post img {
    {block:indexpage}
    width:250px;
    {block:iftwocolumns}
    width:300px;
    {/block:iftwocolumns}
    {/block:indexpage}
    {block:ifImageShadows}
    -webkit-box-shadow: 3px 14px 5px rgba(0,0,0,0.3);
    -moz-box-shadow: 3px 14px 5px rgba(0,0,0,0.3);
    box-shadow: 1px 2px 3px rgba(0,0,0,0.3);
    {/block:ifImageShadows}
    }

.permalink {
    margin:0px;
    text-align:right;
    padding:0px;
    opacity:0;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    }

.permalink a:hover{
    color:{color:Hover}
    }

.post:hover .permalink {
    opacity: 1;
    }

.notes{
    width:300px;
    font-size:9px;
    color:#000;
    text-align:left;
    }
    
.viewnotes{
    margin-top:10px;
    font-size:9px;
    color:#000;
    text-align:left;
    }

ol.notes {
    list-style-type:none;
    margin-left:-20px;
    }
    
ol.notes li.note {
    font-size:9px;
    }


.audio {
    background-color:#000000;
    width:250px;
    {block:iftwocolumns}
    width:300px;
    {/block:iftwocolumns}
    }

::-webkit-scrollbar-thumb:vertical {
    background-color:{color:background};
    height:100px;
    }
    
::-webkit-scrollbar-thumb:horizontal {
    background-color:{color:header};
    height:10px !important;
    }
    
::-webkit-scrollbar {
    height:10px;
    width:10px;
    background-color:{color:header};
    }

ul{
    margin:0;
    padding:0 0 10px 0;
    border-bottom:1px solid {color:Accent};
    }
    
ul h1{
    text-align:left;
    margin:20px 0 10px 0;
    padding:0;
    font-size:11px;
    }

#sidebar li{
    list-style-type:none;
    margin-bottom:5px;
    padding:0px;
    line-height:17px;
    }

#sidebar li a{
    -moz-transition: all 0.3s ease-out; /* FF3.7+ */
    -o-transition: all 0.3s ease-out; /* Opera 10.5 */
    -webkit-transition: all 0.3s ease-out; /* Saf3.2+, Chrome */
    color:{color:nav links};
    }

#sidebar{
    background-color:{color:background};
    position:fixed;
    left:40px;
    top:0;
    height:100%;
    width:130px;
    }

#sidebar a:hover{
    -moz-transition: all 0.3s ease-out; /* FF3.7+ */
    -o-transition: all 0.3s ease-out; /* Opera 10.5 */
    -webkit-transition: all 0.3s ease-out; /* Saf3.2+, Chrome */
    color:{color:Text};
    }

#adam {
    position:fixed;
    top:26px;
    right:3px;}

.ptitle {
    font-size:11px;
    text-transform:uppercase;
    }

.blogtitle{
    text-transform:uppercase;
    -webkit-text-stroke: 1px transparent;
    {block:IfShowIcon}
    padding:30px 0 10px 0;
    {/block:IfShowIcon}
    {block:IfNotShowIcon}
    padding:30px 0px 10px 0px;
    {/block:IfNotShowIcon}
    font-size:{text:blogtitle size}px;
    text-align:left;
    font-weight:bold;
    }

#portrait {
    margin:auto;
    width: 96px;
    height: 96px;
    background-image:url({PortraitURL-96});
    -moz-border-radius: 48px;
    -webkit-border-radius: 48px;
    }

.title, .h2{
    font-weight:bold;
    font-size:16px;
    line-height:20px;
    text-align:left;
    }

.buttons{
    float:left;
    margin-right:10px;
    width:50px;
    font-size: 10px;
    font-weight: bold;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background-color: #f5f5f5;
    text-align: center;
    padding: 4px 10px 3px 10px;
    border: 0px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-style: solid;
    border-color: #e4e4e4;
    border-width: thin;
    }

.buttons:hover{
    background:#ddd;
    }

.pagination {
    height:20px;
    border-top:0px !important;
    border-bottom:1px solid {color:Accent};
    }

.tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {
    display:none;
    }
    
#infscr-loading {
    display:none;
    }
    
.navigation{
    display:none;
    }

{CustomCSS}
</style>




{block:IndexPage}
<script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
<script src="http://static.tumblr.com/twte3d7/0pellzh2t/infinitescroll.js"></script>

<script type="text/javascript">
$(window).load(function () {
$('.content').masonry(),
$('.masonryWrap').infinitescroll({
navSelector : ".navigation",
nextSelector : ".navigation a#next",
itemSelector : ".post",
bufferPx : 10000,
extraScrollPx: 10000,
loadingImg : "",
loadingText : "",
},
function() { $('.content').masonry({ appendedContent: $(this) }); }
);
});
</script>
{/block:IndexPage}

<script type="text/javascript" src="http://static.tumblr.com/twte3d7/BH7lio0yf/jquery.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/twte3d7/RhUlio0y7/lazyload.js"></script>
<script type="text/javascript" charset="utf-8">
var $j = jQuery.noConflict();
$j(function() {
if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
$j("img").lazyload({
placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
effect: "fadeIn",
});
});
<style type="text/css">
.install_button{display:none;}
a.btn{position:absolute;z-index:999999999999;white-space:nowrap;outline:0;text-decoration:none;cursor:pointer;overflow:hidden;font:600 12px/18px "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;height:20px;padding:0 5px;-webkit-font-smoothing:antialiased;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;-webkit-transition-property:padding;-moz-transition-property:padding;-ms-transition-property:padding;-o-transition-property:padding;transition-property:padding;-webkit-transition-duration:.1s;-moz-transition-duration:.1s;-ms-transition-duration:.1s;-o-transition-duration:.1s;transition-duration:.1s;-webkit-transition-timing-function:ease;-moz-transition-timing-function:ease;-ms-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}.btn{color:#fff;border:1px solid rgba(0,0,0,0.18);background:rgba(0,0,0,0.38);text-shadow:1px 1px 0 rgba(0,0,0,0.08)}a.btn,a.btn:hover{color:white!important}.btn{margin-bottom:5px;color:#fff;border:1px solid rgba(0,0,0,0.18);background:rgba(0,0,0,0.38);text-shadow:1px 1px 0 rgba(0,0,0,0.08);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.btn:hover::after,.btn:focus::after{background:rgba(255,255,255,0.09);color:white}.btn:active::after{background:rgba(255,255,255,0.18) color:white}.btn_label.show{display:block}.btn::after{position:absolute;top:0;right:0;bottom:0;left:0;content:'';-webkit-border-radius:inherit;-moz-border-radius:inherit;border-radius:inherit}.btn.icon::before{display:block;content:'';position:absolute;top:0;left:0;bottom:0;width:20px;border-radius:inherit;background:url('http://static.tumblr.com/tpqedpr/cQ1mbwb60/de.png') 0 0 no-repeat}.btn.theme::before{background-position:0 -0px}.btn img{width:15px}.btn.icon{padding-left:20px}.btn:active::after {background:rgba(255,255,255,0.18)}.clear {clear: both;} #pagination {display: none;}
</style>
</script>
</head>
<body>
<!-- SCM Music Player http://scmplayer.net -->
<script type="text/javascript" src="http://scmplayer.net/script.js"
data-config="{'skin':'skins/black/skin.css','volume':50,'autoplay':true,'shuffle':false,'repeat':1,'placement':'top','showplaylist':false,'playlist':[{'title':' ','url':'http://www.youtube.com/watch?v=lhcXfbZLeOI&feature=share'}]}" ></script>
<!-- SCM Music Player script end -->

<div id="sidebar">
<div class="blogtitle">{block:IfShowIcon}<a href="/"><div id="portrait"></div></a>{/block:IfShowIcon}{block:IfNotShowIcon}<a href="/">{Title}</a>{/block:IfNotShowIcon}</div>
{block:Description}<ul>{Description}</ul>{/block:Description}
<ul><h1>Navigation</h1>
<li><a href="/archive">Archive</a></li>
{block:AskEnabled}<li><a href="/ask">Message</a></li>{/block:AskEnabled}
<li><a href="/random">Random</a><li>
{block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}
{/block:HasPages}
{block:ifCustomLinkOneTitle}<li><a href="{text:Custom Link One}">{text:Custom Link One Title}</a></li>{/block:ifCustomLinkOneTitle}
{block:ifCustomLinkTwoTitle}<li><a href="{text:Custom Link Two}">{text:Custom Link Two Title}</a></li>{/block:ifCustomLinkTwoTitle}
{block:ifCustomLinkThreeTitle}<li><a href="{text:Custom Link Three}">{text:Custom Link Three Title}</a></li>{/block:ifCustomLinkThreeTitle}
{block:ifCustomLinkFourTitle}<li><a href="{text:Custom Link Four}">{text:Custom Link Four Title}</a></li>{/block:ifCustomLinkFourTitle}
{block:ifCustomLinkFiveTitle}<li><a href="{text:Custom Link Five}">{text:Custom Link Five Title}</a></li>{/block:ifCustomLinkFiveTitle}
<li><a href="http://www.google.fr/#hl=fr&output=search&sclient=psy-ab&q=tumblr+theme&oq=tumblr+theme&gs_l=hp.3..35i39j0l3.745.2046.0.2143.12.12.0.0.0.0.213.1667.0j9j2.11.0...0.0...1c.1.6.psy-ab.aPx0guvw31c&pbx=1&bav=on.2,or.r_qf.&bvm=bv.43828540,d.d2k&fp=386b656d32fa423b&biw=1279&bih=664">Theme</a></li></ul>

{block:indexpage}<div class="navigation">{block:Pagination}{block:NextPage}<p id="page_nav"><a style="float:right" href="{NextPage}" id="next">Older</a>{/block:NextPage}{block:PreviousPage}<a style="float:left" href="{PreviousPage}">Newer</a></p>{/block:PreviousPage}{/block:Pagination}</div>{/block:indexpage}</div>




<div class="content">
{block:Posts}


{block:Text}
<div class="post"><div class="text">{block:Title}<div class="ptitle">{Title}</div>{/block:Title}{Body}{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div></div></div>{/block:IndexPage}{/block:Text}


{block:Photo}<div class="post">{block:IndexPage}<a href="{Permalink}">{/block:IndexPage}{block:IndexPage}<a href="{Permalink}">{/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}{/block:PermalinkPage}<img src="{block:IndexPage}{PhotoURL-500}{/block:IndexPage}{block:PermalinkPage}{PhotoURL-HighRes}{/block:PermalinkPage}" alt="{PhotoAlt}" {block:indexpage}width="64px"{block:indexpage}/>{block:IndexPage}</a>{/block:IndexPage}{block:PermalinkPage}{LinkCloseTag}{block:ifnotshowcaptions}{Caption}<br>{/block:ifnotshowcaptions}Posted {TimeAgo} with {NoteCountWithLabel}<br> {block:HasTags}{block:Tags}<a href="{TagURL}">{Tag}, </a>{/block:Tags}{/block:HasTags}{/block:PermalinkPage}{block:ifshowcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifshowcaptions}</div>{/block:Photo}


{block:Photoset}
<div class="post"><div class="photoset">
<center>{Photoset-250}</center>
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
</div></div>{/block:Photoset}


{block:Quote}
<div class="post">{Quote}<br><a href="{Permalink}">{block:Source}<i> by {Source}{/block:Source}</a></i></div>
{/block:Quote}

{block:Link}
<div class="post">
<div class="ptitle"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div>{/block:IndexPage}
</div>
{/block:Link}

{block:Chat}
<div class="post">{block:Title}<b>{Title}</b>{/block:Title}
{block:Lines}{block:Label}<b>{Label}</b> {Line}<br>{/block:Label}{/block:Lines}{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div>{/block:IndexPage}
</div>
{/block:Chat}

{block:Video}
<div class="post"><div class="video">{Video-250}
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}</div></div>{/block:Video}

{block:Audio}
<div class="post">
<div class="audio">
{AudioPlayerBlack}</div>{Caption}
{block:PermalinkPage}{/block:PermalinkPage}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{TimeAgo}</a></div>{/block:IndexPage}
</div>
{/block:Audio}

{block:PermalinkPage}
<br>{block:PostNotes}<div class="viewnotes"></div>{/block:PostNotes}
<div class="notes">
{block:PostNotes}{PostNotes}{/block:PostNotes}</div>{/block:PermalinkPage}

{/block:Posts}

</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script language="JavaScript">
// FHS Tumblr Online Counter
var height = '56';
var ref = (''+document.referrer+'');
document.write('<script src="http://freehostedscripts.net/ocounter.php?site=ID2669683&s=1&h=' + height + '&e1=Online User&e2=Online Users&r=' + ref + '"><\/script>');
</script>
<div style="position:fixed;z-index:1338; !important;top:25px;right:3px;"><script src="http://totallylayouts.com/tumblr/visitor-counter/counter.js?id=363386"></script></div>
</html>


Thanks you.

This post has been edited by phigom: Mar 18 2013, 09:44 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post Mar 19 2013, 02:30 AM
Post #2


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9
To change the circle portrait to square get rid of the border-radius declaration for #portrait.

I see a favicon. It's a 16 x 16 px png file. Make your leaf image at least at that size and see if you can change this:
<link rel="shortcut icon" href="http://25.media.tumblr.com/avatar_2d4a9e742042_16.png"> to point to the new file.

For this, as for a page title, I have no idea how that should be done in Tumblr.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
phigom
post Mar 19 2013, 10:14 AM
Post #3





Group: Members
Posts: 2
Joined: 18-March 13
Member No.: 18,867
Oh really cool.

I already tried to change this line, but I did not succeed. Thank you very much.
I do not understand how to change the favicon, I do not know if it is necessary to host it, and where to put this line .. It's okay, it's not the most important. thank you very much!

I am not against for another help.

Also, I would like to know how I can get rid of the 'Install Theme' button. I tried many methods, change the 'block' to 'none', or also tried to find with the command CMD + F, 'Button Theme', 'Install Theme, 'Theme', or even the forwarding address.

This post has been edited by phigom: Mar 19 2013, 10:19 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post Mar 19 2013, 12:02 PM
Post #4


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9
Surely you had to upload the previous favicon at the resource where it is found now. Maybe you can redo that with the new image.

There is a "Theme" inside the sidebar's navigation, if that's what you mean. It's one of the list items I see in the code you posted:
CODE
<li><a href="http://www.google.fr/#hl=fr&output=search&sclient=psy-ab&q=tumblr+theme&oq=tumblr+theme&gs_l=hp.3..35i39j0l3.745.2046.0.2143.12.12.0.0.0.0.213.1667.0j9j2.11.0...0.0...1c.1.6.psy-ab.aPx0guvw31c&pbx=1&bav=on.2,or.r_qf.&bvm=bv.43828540,d.d2k&fp=386b656d32fa423b&biw=1279&bih=664">Theme</a></li>

As to how to get rid of that, I wouldn't know. As stated at the top of this forum category, many regulars are not familiar with services like Tumblr. I have no idea how it works, I write my own HTML/CSS in a (dedicated) text-editor. Sorry.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
« Next Oldest · Web Site Functionality · Next Newest »
 

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 25th April 2024 - 09:10 AM
Invision Power Board © 2024  IPS, Inc.
Licensed to: HTMLHelp.com, LLC