The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Help with tumblr photos, resizing photos without breaking the theme
ludicious
post Jun 8 2012, 02:22 PM
Post #1





Group: Members
Posts: 1
Joined: 8-June 12
Member No.: 17,242



Hello, I am trying to resize my photos and center them with an 800px width.
The tumblr theme I am using seems to use the full size that I upload the pictures at.
I don't want to re upload everything I just want them to resize automatically.
I like everything about this theme except for the image sizes.

here is my HTML code and link to the page.

thank you

http://akaitsukimusic.tumblr.com/

<!doctype html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!-- Consider adding a manifest.appcache: h5bp.com/d/Offline -->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1">

<title>{Title}{block:PostTitle} - {PostTitle}{/block:PostTitle}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<!-- http://static.tumblr.com/x0ukhl9/Se8lwlis5/styles.css -->
<!--#1--><link rel="stylesheet" type="text/css" media="screen" href="http://static.tumblr.com/x0ukhl9/vyXm0lsms/styles-lite.css"/><!--!#1-->
<!-- css/jquery.fancybox.css -->
<link rel="stylesheet" type="text/css" media="screen" href="http://static.tumblr.com/x0ukhl9/u2Llwlc1j/jquery.fancybox.css"/>

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

<!--[if IE]>
<style type="text/css">
.clearfix { zoom: 1; }
</style>
<![endif]-->

<!-- js/libs/modernizr.custom.08999.js -->
<script src="http://static.tumblr.com/x0ukhl9/fOqlwlc36/modernizr.custom.08999.js"></script>

<!-- Boolean -->
<meta name="if:Show Background Texture" content="1"/>
<meta name="if:Light Colors" content="0"/>
<meta name="if:Center Posts" content="0"/>
<meta name="if:Center Small Images" content="0"/>
<meta name="if:Show Archive Button" content="1"/>
<meta name="if:Show RSS Button" content="0"/>
<meta name="if:Show Search" content="1"/>
<meta name="if:Show About Button" content="1"/>
<meta name="if:Show Social Network Icons" content="1"/>
<meta name="if:Show Reblogged From" content="0"/>
<meta name="if:Show Tags" content="1"/>
<meta name="if:Show Disqus Comment Count" content="1"/>
<meta name="if:Show Disqus Comments" content="1"/>
<meta name="if:Show Note Count" content="1"/>
<meta name="if:Show Notes" content="1"/>

<!-- Text -->
<meta name="text:Title Caption" content=""/>
<meta name="text:Search Placeholder" content="Search"/>
<meta name="text:Archive Button" content="Archive"/>
<meta name="text:RSS Button" content="RSS"/>

<!-- Profile Links -->
<meta name="text:Disqus Shortname" content=""/>
<meta name="text:Dribbble Username" content=""/>
<meta name="text:Forrst Username" content=""/>
<meta name="text:Twitter Username" content=""/>
<meta name="text:Flickr Profile URL" content=""/>
<meta name="text:Skype Username" content=""/>
<meta name="text:Facebook Profile URL" content=""/>
<meta name="text:Google Plus URL" content=""/>
<meta name="text:Vimeo Profile URL" content=""/>
<meta name="text:Delicious Username" content=""/>
<meta name="text:Last fm Username" content=""/>
<meta name="text:Youtube Username" content=""/>
<meta name="text:Google Analytics ID" content="" />
<meta name="text:Copyright Text" content="" />

<!-- Colors -->
<meta name="color:Background Color" content="#202020"/>
<meta name="color:Link Color" content="#217ed8"/>
<meta name="color:Link Visited Color" content="#BBBBBB"/>

<style type="text/css">
body {
background-color: {color:Background Color};
}

p a, .action a, .light p a, .light .action a {
color: {color:Link Color};
}

p a:hover, .action a:hover, .light p a:hover, .light .action a:hover {
color: {color:Link Color};
}

p a:visited, .action a:visited, .light p a:visited, .light .action a:visited {
color: {color:Link Visited Color};
}

{CustomCSS}
</style>
</head>

<body class="{block:IfShowBackgroundTexture}
bg-texture
{/block:IfShowBackgroundTexture}
{block:IfLightColors}
light
{/block:IfLightColors}
{block:IfCenterPosts}
centered
{/block:IfCenterPosts}
{block:IfCenterSmallImages}
centered-small
{/block:IfCenterSmallImages}">
<div class="wrapper">
<div id="content" class="clearfix">

<div id="expander" style="display: none;">
<div class="wrap">
<div class="content clearfix">
{block:Description}
<p class="description">{Description}</p>
{/block:Description}
</div>
</div>
</div>

<div id="header">
<div class="content">
<div id="user-info" class="{block:IfTitleCaption}caption{/block:IfTitleCaption}">
<div class="content clearfix">

<a href="/" title="{Title}" class="main">
<img src="{PortraitURL-48}" class="portrait"/>

<div class="info">
<h1 class="title">{Title}</h1>

{block:IfTitleCaption}
<p class="caption">{text:Title Caption}</p>
{/block:IfTitleCaption}
</div>
</a>

{block:IfShowSocialNetworkIcons}
<ul id="profiles" class="clearfix">
{block:IfDribbbleUsername}
<li><a target="_blank" class="dribbble" href="http://dribbble.com/{text:Dribbble Username}"></a></li>
{/block:IfDribbbleUsername}

{block:IfForrstUsername}
<li><a target="_blank" class="forrst" href="http://forrst.com/people/{text:Forrst Username}"></a></li>
{/block:IfForrstUsername}

{block:IfTwitterUsername}
<li><a target="_blank" class="twitter" href="http://twitter.com/{text:Twitter Username}"></a></li>
{/block:IfTwitterUsername}

{block:IfFlickrProfileURL}
<li><a target="_blank" class="flickr" href="{text:Flickr Profile URL}"></a></li>
{/block:IfFlickrProfileURL}

{block:IfSkypeUsername}
<script type="text/javascript" src="http://download.skype.com/share/skypebuttons/js/skypeCheck.js"></script>
<li><a class="skype" href="skype:{text:Skype Username}?call"></a></li>
{/block:IfSkypeUsername}


<li><a target="_blank" class="facebook" href="http://www.facebook.com/akaitsukimusic"></a></li>


{block:IfGooglePlusURL}
<li><a target="_blank" class="google" href="{text:Google Plus URL}"></a></li>
{/block:IfGooglePlusURL}

{block:IfVimeoProfileURL}
<li><a target="_blank" class="vimeo" href="{text:Vimeo Profile URL}"></a></li>
{/block:IfVimeoProfileURL}

{block:IfDeliciousUsername}
<li><a target="_blank" class="delicious" href="http://delicious.com/{text:Delicious Username}"></a></li>
{/block:IfDeliciousUsername}


<li><a target="_blank" class="lastfm" href="http://www.last.fm/music/akaitsuki"></a></li>



<li><a target="_blank" class="youtube" href="http://youtube.com/akaitsukimusic"></a></li>

</ul>
{/block:IfShowSocialNetworkIcons}

<ul id="navigation">
{block:Pages}
<li><a href="{URL}">{Label}</a></li>
{/block:Pages}

{block:IfShowRssButton}
<li><a href="{RSS}">{text:RSS Button}</a></li>
{/block:IfShowRssButton}

{block:AskEnabled}
<li><a href="/ask">{AskLabel}</a></li>
{/block:AskEnabled}

{block:IfShowArchiveButton}
<li><a href="/archive">{text:Archive Button}</a></li>
{/block:IfShowArchiveButton}

{block:SubmissionsEnabled}
<li><a href="/submit">{SubmitLabel}</a></li>
{/block:SubmissionsEnabled}

{block:Description}
{block:IfShowAboutButton}
<li><a id="expand-about" href="#">About</a></li>
{/block:IfShowAboutButton}
{/block:Description}
</ul>

{block:IfShowSearch}
<form action="/search" method="get" class="search">
<input type="text" name="q" value="{SearchQuery}" placeholder="{text:Search Placeholder}"/><span class="search" onclick="$(this).parent().submit();" autocomplete="off"></span>
</form>
{/block:IfShowSearch}
</div>
</div>
<div class="divider"></div>
</div>
</div>

<div id="body">
<div class="content {block:Permalink}permalink{/block:Permalink}" id="posts">
{block:Posts}
<div class="post clearfix {block:IndexPage}index{/block:IndexPage} {PostType}">

<div class="content">
{block:Text}
{block:Title}
<h1>
<a href="{Permalink}">{Title}</a>
</h1>
{/block:Title}

<div class="body clearfix">
{Body}
</div>
{/block:Text}

{block:Photo}
<div class="photo loading shadow">
{LinkOpenTag}
<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" />
{LinkCloseTag}
</div>

{block:Caption}
<div class="body clearfix">
{Caption}
</div>
{/block:Caption}
{/block:Photo}

{block:Photoset}

{Photoset-500}

{block:Caption}
<div class="body clearfix">
{Caption}
</div>
{/block:Caption}
{/block:Photoset}

{block:Quote}
<h1 class="quote {Length}"><a href="{Permalink}">&ldquo;{Quote}&rdquo;</a></h1>

{block:Source}
<div class="body clearfix">
<p class="source">&mdash; {Source}</p>
</div>
{/block:Source}
{/block:Quote}

{block:Video}

<div class="video shadow">
{Video-500}
</div>

{block:Caption}
<div class="body clearfix">
{Caption}
</div>
{/block:Caption}
{/block:Video}

{block:Audio}
<h1>{block:Artist}{Artist}{/block:Artist}{block:TrackName}{block:Artist} - {/block:Artist}{TrackName}{/block:TrackName}</h1>
<div class="audio-player clearfix" rel="{PostID}">
<div class="album-cover">
{block:AlbumArt}
<a href="{AlbumArtURL}" class="fancybox" title="{block:Artist}{Artist}{/block:Artist}{block:TrackName}{block:Artist} - {/block:Artist}{TrackName}{/block:TrackName}"><img src="{AlbumArtURL}" class="cover"/></a>
{/block:AlbumArt}
</div>
<div class="track inset">
<div class="flash">{AudioPlayerBlack}</div>
<div class="inner">
<div class="loaded"></div>
<div class="current"></div>
</div>
</div>
</div>

{block:Caption}
<div class="body clearfix">
<p class="caption">{Caption}</p>
</div>
{/block:Caption}
{/block:Audio}

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

<ul class="body">
{block:Lines}
<li class="{Alt} clearfix">
{block:Label} <span class="label">{Label}</span>{/block:Label}
<p>{Line}</p>
</li>
{/block:Lines}
</ul>
{/block:Chat}

{block:Link}
<h1>
<a class="link" href="{URL}" target="{Target}"><div class="icon"></div>{Name}</a>
</h1>

{block:Description}
<div class="body">{Description}</div>
{/block:Description}
{/block:Link}

{block:Answer}
<h1 class="quote">{Question}</h1>

<div class="body">
{Answer}
<p>&raquo; Asked by {Asker}</p>
</div>
{/block:Answer}

<div class="meta-info clearfix">
{block:Date}
<a href="{Permalink}" class="date inset">
<div class="icon"></div>
<span class="month">{ShortMonth}</span>
<span class="day">{DayOfMonth}</span>
<span class="year">{Year}</span>
</a>
{/block:Date}

{block:IfDisqusShortname}
{block:IfShowDisqusComments}
{block:IfShowDisqusCommentCount}
<a class="inset comments dsq-comment-count" href="{Permalink}#disqus_thread">Comments</a>
{/block:IfShowDisqusCommentCount}
{/block:IfShowDisqusComments}
{/block:IfDisqusShortname}

{block:IfShowNoteCount}
{block:NoteCount}
<a href="{Permalink}" class="note-indicator inset">
{NoteCountWithLabel}
</a>
{/block:NoteCount}
{/block:IfShowNoteCount}

{block:IfShowRebloggedFrom}
{block:RebloggedFrom}
<a href="{ReblogParentURL}" class="reblog inset">
<div class="icon"></div>
<span class="title">Reblogged from</span>
{ReblogParentName}
</a>
{/block:RebloggedFrom}
{/block:IfShowRebloggedFrom}

{block:IfShowTags}
{block:HasTags}
<ul class="tags">
{block:Tags}<li class="inset"><a class="tag" href="{TagURL}">#{Tag}</a></li>{/block:Tags}
</ul>
{/block:HasTags}
{/block:IfShowTags}
</div>

{block:Permalink}
<div class="commentary clearfix">
<div class="divider"></div>

{block:IfDisqusShortname}
{block:IfShowDisqusComments}
<div class="disqus-wrap">
<div id="disqus_thread"></div>
</div>

<script>
var disqus_url = "{Permalink}";
var disqus_title ="{block:PostTitle}{PostTitle}{/block:PostTitle}";
var disqus_identifier = {PostID};
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://{text:Disqus Shortname}.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
{/block:IfShowDisqusComments}
{/block:IfDisqusShortname}

{block:PostNotes}
{block:IfShowNotes}
<div class="notes-wrap {block:IfNotShowDisqusComments}no-pull{/block:IfNotShowDisqusComments}">
{PostNotes}
</div>
{/block:IfShowNotes}
{/block:PostNotes}
</div>
{/block:Permalink}

</div>
</div>
{/block:Posts}

{block:IfDisqusShortname}
<script>
var disqus_shortname = '{text:Disqus Shortname}';
(function () {
var s = document.createElement('script'); s.async = true;
s.src = 'http://{text:Disqus Shortname}.disqus.com/count.js';
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s); }());
</script>
{block:IfDisqusShortname}

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

<div class="jump clearfix">
{block:JumpPagination length="5"}
{block:CurrentPage}
<span class="current-page">{PageNumber}</span>
{/block:CurrentPage}

{block:JumpPage}
<a href="{URL}">{PageNumber}</a>
{/block:JumpPage}
{/block:JumpPagination}
</div>

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

<div class="push"></div>
</div>

<footer>
<div class="wrap">
<div class="content clearfix">
Copyright &copy; {CopyrightYears}
{block:IfCopyrightText}
{text:CopyrightText}
{/block:IfCopyrightText}

{block:IfNotCopyrightText}
{Title}
{/block:IfNotCopyrightText}

<a href="http://www.tumblr.com/theme/33285">HD Exhibit</a> Theme by <a href="https://twitter.com/Breefield">Dustin Hoffman</a>
</div>
</div>
</footer>

<!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="http://static.tumblr.com/x0ukhl9/xrulwlc8b/jquery-1.6.2.min.js"><\/script>')</script>
<script src="http://static.tumblr.com/x0ukhl9/NX8lwlc8w/jquery.killphotoset.js"></script>
<script src="http://static.tumblr.com/x0ukhl9/NjTlwlcaq/jquery.fancybox.pack.js"></script>
<!--#2--><script src="http://static.tumblr.com/x0ukhl9/QnBm0lso9/script-lite.js"></script><!--!#2-->

{block:IfGoogleAnalyticsID}
<script>
window._gaq = [['_setAccount','{text:Google Analytics ID}'],['_trackPageview'],['_trackPageLoadTime']];
Modernizr.load({
load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
});
</script>
{/block:IfGoogleAnalyticsID}
</body>
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

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

 



- Lo-Fi Version Time is now: 1st August 2014 - 09:46 PM