The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
 Reply to this topicStart new topic
> [Noobie] Can't find the <body> tag to place SCM music player.
Yukigo Inuoe
post Jul 2 2016, 07:49 AM
Post #1





Group: Members
Posts: 2
Joined: 2-July 16
Member No.: 24,387
So yep, I'm trying to add SCM player to a customized theme but I cannot seem to be able to find the <body> tag, or at least, I don't know where to put the codes. Anyone who is willing to help this noobie out? TT.TT

Here's the code to my theme:

<html>
<head>

<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="image:Sidebar" content=""/>

<meta name="color:Background" content="#f8f8f8"/>
<meta name="color:Post" content="#fff"/>
<meta name="color:Border" content="#eee"/>
<meta name="color:Text" content="#555"/>
<meta name="color:Link" content="#999"/>
<meta name="color:Hover" content="#89adc3"/>

<meta name="if:Title" content=""/>
<meta name="if:Drop Links" content=""/>
<meta name="if:Load More" content=""/>
<meta name="if:Paginate" content=""/>
<meta name="if:Round Edges" content=""/>

<meta name="select:Font" content="font_karla" title="Karla">
<meta name="select:Font" content="font_os" title="Open Sans">

<meta name="select:Navigation" content="nare" title="Regular">
<meta name="select:Navigation" content="nasi" title="Side">

<meta name="select:Permalink" content="boso" title="Bottom - Solid">
<meta name="select:Permalink" content="boho" title="Bottom - Hover">
<meta name="select:Permalink" content="siso" title="Side - Solid">
<meta name="select:Permalink" content="siho" title="Side - Hover">

<meta name="select:Tags" content="tshow" title="Show">
<meta name="select:Tags" content="thide" title="Hide">
<meta name="select:Tags" content="thover" title="Hover">

<meta name="select:Captions" content="creg" title="Regular">
<meta name="select:Captions" content="cmin" title="Minimal">
<meta name="select:Captions" content="cinl" title="Inline">
<meta name="select:Captions" content="chid" title="Hide">

<meta name="text:Post" content="350"/>
<meta name="text:Sidebar" content="150"/>
<meta name="text:Margin" content="75"/>
<meta name="text:Padding" content="8"/>

<meta name="text:Link 1" content="/"/>
<meta name="text:Link 1 Title" content="one"/>
<meta name="text:Link 2" content="/" />
<meta name="text:Link 2 Title" content="two"/>
<meta name="text:Link 3" content="/" />
<meta name="text:Link 3 Title" content="three"/>
<meta name="text:Link 4" content="/" />
<meta name="text:Link 4 Title" content="four"/>

<link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link href='https://fonts.googleapis.com/css? family=Open+Sans:400,400italic,600,600italic,700,700italic|Karla:400,400italic,7
00,700italic' rel='stylesheet' type='text/css'>

<style type="text/css">

/* Scroll */

::-webkit-scrollbar {width:11px;height:11px;background:{color:Border};}
::-webkit-scrollbar-thumb {background:rgba({RGBcolor:Link},0.5);}
::-webkit-scrollbar,::-webkit-scrollbar-thumb {
border:5px solid {color:Background};
}

/* Controls */

#tumblr_controls,.tmblr-iframe.tmblr-iframe--desktop-logged-in-controls.iframe-controls--desktop{-webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%);opacity:0.5;}

/* General */

body {margin:0;color:{color:Text};background:{color:Background};}
a:link, a:active, a:visited {text-decoration:none;}
body,p,pre,blockquote,big,small,sub,sup {font-size:9px;}
.font_karla{
font-family:'Karla',Arial,Helvetica,sans-serif;
font-smooth:always;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing: grayscale;
}

.font_os{font-family:'Open Sans',Arial,Helvetica,sans-serif;}
a,.tags,.our_button,.like_button,.psid,.pbot {
transition:0.5s ease;
-o-transition:0.5s ease;
-moz-transition:0.5s ease;
-webkit-transition:0.5s ease;
}

/* Scroll to Top */

.c,.top{position:fixed;right:30px;width:40px;}
.c {bottom:30px;}
.top {bottom:50px;display:none;}

/* Pagination */

.cp {font-weight:600;}
.cp,.jp,.pag a{display:inline-block;vertical-align:middle;margin:0 10px;}
.pag a i,.top{font-size:20px;}
.pag {position:relative;}
.load {cursor:pointer;display:block;}
.c,.top,.pag,.load {text-align:center;}
.c,.pag,.load {font-size:9px;letter-spacing:1px;text-transform:uppercase;}
{block:ifnotPaginate}
.pag,#infscr-loading {display:none!important;}
{/block:ifnotPaginate}

/* Containers */

.center {
position:relative;
margin:{text:Margin}px auto;
width:calc({text:Post}px + 2px);
}

.entry_hold {background:{color:Post};border:1px solid {color:Border};}
.entry img{max-width:100%;height:auto;}
.entry {
width:calc({text:Post}px + 2px + ({text:Padding}px * 2));
margin:{text:Margin}px 0;
}

/* Sidebar */

aside {
position:fixed;
width:{text:Sidebar}px;
top:{text:Margin}px;
margin-left:calc(-{text:Sidebar}px + -{text:Margin}px + -2px);
background:{color:Post};
border:1px solid {color:Border};
}

.image img{width:100%;}
.desc {margin:15px;}
.lh {cursor:help;}
.lb {display:none;}
.nasi nav{position:absolute;top:0;width:70px;text-align:right;margin-left:-80px;}
.nasi nav a:first-of-type {margin-top:0;}
.nasi nav a {display:block;margin:10px 0;}
.nare nav {padding:10px;}
.nare nav a {display:inline-block;width:calc(50% - 10px);margin:5px;}

nav {font-size:0;}
nav a {font-size:9px;line-height:100%;}

/* Titles */

h1 {
margin:15px 15px -5px;
font-size:10px;
text-transform:uppercase;
letter-spacing:1px;
font-weight:400;
}

h2 {margin:10px;font-size:11px;font-weight:400;}
h3,h4,h5 {margin:10px;font-weight:600;font-size:9px;}

/* Permalinks */

.boso .psid,.boho .psid,.siso .pbot,.siho .pbot {display:none;}
.siho .psid,.boho .pbot {opacity:0;}
.siho .entry:hover .psid,.boho .entry:hover .pbot {opacity:1;}

.psid {
font-size:0;
position:absolute;
padding:5px 0 0 10px;
margin-left:calc({text:Post}px + 2px + ({text:Padding}px * 2));
width:100px;
}

.psid a {text-transform:lowercase;display:block;margin:5px 0;}
.psid b {font-size:9.5px;}
.pbutts {margin:15px 0;}
.pbutts a {display:inline-block;margin:0 0 0 7px;}

.pbot {padding:9px;font-size:0;}
.ple {padding:1px 0;}
.ple b {margin:0 4px;font-weight:400;opacity:0.75;}
.ple a,.ple b {display:inline-block;text-transform:lowercase;}
.ple a,.ple b,.tags a,.psid a{font-size:9px;line-height:100%;}
.ple,.pri {display:inline-block;vertical-align:top;width:50%;}
.pri {text-align:right;opacity:0.75;}
.pri .fa-retweet {margin-left:7px;}
.fa-heart {font-size:10px;}
.fa-retweet {font-size:11px;}

.custom-like-button *{cursor:pointer!important;}
.custom-like-button {
position:relative;
display:inline-block;
vertical-align:top;
width:10px;
height:10px;
cursor:pointer;
}

.like_button:hover + .our_button {color:{color:Hover};}
.like_button.liked + .our_button {color:{color:Hover};}
.like_button iframe {width:100%!important;height:100%!important;}
.like_button {z-index:10;opacity:0;}
.our_button {z-index:1;}
.our_button,.like_button {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}

.entry:hover .thover{opacity:1;}
.tshow,.thover{display:block;position:relative;}
.thide {display:none;}
.thover {opacity:0;}
.tags {margin-top:4px;}
.tags a {margin-right:5px;text-transform:none;display:inline;}

.sid {margin-top:10px;}
.sid a {display:block;margin:5px 0;}

/* Quotes */

.qut_hold {padding:20px;}
.src {margin-bottom:10px;}
.qut {font-size:10px;}

/* Audio & Chat */

.chat,.lines,.chat h2,.audio {padding:10px;}
.chat h2 {margin:0;}
.lines b{display:block;font-weight:400;}

.play {padding:10px;background:#e4e4e4;height:27px;width:27px;}
.audio {font-size:0;}
.play,.au {display:inline-block;vertical-align:middle;}
.soundcloud_audio_player{padding:15px 0;}
.tn {text-transform:uppercase;letter-spacing:1px;}
.au span {display:block;margin:3px 0;font-size:9px;}
.au {width:calc(100% - 62px);margin-left:15px;}
.tumblr_audio_player {width:27px;height:27px;overflow:hidden;}

/* Text */

ol,ul {padding:0 0 0 20px;}
li {margin:5px;}
p,blockquote,pre,ul,ol{margin:10px;}
b,strong {font-weight:600;}
blockquote p{margin:10px 0;}
blockquote p:first-child{margin:0 0 10px;}
blockquote p:last-child{margin:10px 0 0;}
blockquote p:only-child{margin:0;}
blockquote blockquote {margin:0;}
blockquote{padding-left:10px;border-left:1px solid {color:Border};}
pre {
white-space:pre-wrap;
white-space:-moz-pre-wrap;
white-space:-pre-wrap;
white-space:-o-pre-wrap;
word-wrap:break-word;
}

/* Captions */

.txt iframe,.cap iframe{display:block;max-width:100%;overflow:hidden;}
.txt,.cap{padding:10px;}

.cmin blockquote {padding:0;border:0;}
.chid {display:none;}
.cinl {padding:20px;}
.cinl *:not(a):not(ul):not(ol):not(li){margin:0;padding:0;display:inline;}
.cinl p:first-of-type {display:inline!important;}
.cinl blockquote {border:0;}
.cinl p,.cinl blockquote p {display:block!important;margin:0!important;}

/* Video */

.video {overflow:hidden;}
.vine-embed,#youtube_iframe {display:block;}
.instagram-media {border-radius:0!important;box-shadow:none!important;}

/* Photosets */

#tumblr_lightbox,.tmblr-lightbox {
background:rgba({RGBcolor:Background},0.99)!important;
}

#vignette,#tumblr_lightbox_caption,.vignette,.lightbox-caption{
opacity:0!important;
}

#tumblr_lightbox_center_image, #tumblr_lightbox_left_image,
#tumblr_lightbox_right_image, .lightbox-image {
box-shadow:none!important;
border-radius:0px!important;
{block:ifRoundEdges}border-radius:4px!important;{/block:ifRoundEdges}
}

/* Ask */

.ask {padding:20px;}
.aski {margin:0 0 10px;line-height:20px;font-size:10px;}
.aski img {float:left;width:20px;margin-right:7px;}

/* Permalink Page + Postnotes */

.pph {text-transform:lowercase;}
.perma {padding:15px;line-height:175%;}
.pmt a:after {content:',';}
.pmt a:last-of-type:after {content:'.';}
.pn ol {margin:0;padding:0;list-style-type:none;}
.pn li{margin:10px;font-size:8.5px;line-height:100%;}
.pn,.pn img{display:none;}
.pn {padding:10px;font-size:0;}
.pnh,.more_notes_link,.notes_loading {display:block;font-weight:600;}
.more_notes_link,.notes_loading {text-align:left!important;}

/* Tooltips */

#s-m-t-tooltip{
max-width:200px;
margin:15px;
z-index:99999999;
padding:6px;
line-height:100%;
word-wrap:break-word;
word-break:break-all;
background:{color:Post};
border:1px solid {color:Border};
}

/* Common Styles */

.ask,p,blockquote,.lines,.pn,.qut,.desc,.cap{line-height:150%;}
a:hover, a h2:hover{color:{color:Hover};}
a,.pbot,.psid,.perma,.src,.lines b,.tn,h2,.ask,ul,ol,.pag{color:{color:Link};}
.qut,.ask,h2{letter-spacing:0.25px;}
h2 a i{margin:0 2px;}

{block:ifRoundEdges}
.play,.aski img,.entry_hold,aside,#s-m-t-tooltip{border-radius:4px;}
.photo,.entry iframe,.video,.image img{border-radius:3px!important;}
{/block:ifRoundEdges}

/* Borders */

.image {padding:2px;}
.bx,.video {padding:{text:Padding}px;}
.pn,.cap,.perma,.nare nav {border-top:1px solid {color:Border};}
.ask,.image {border-bottom:1px solid {color:Border};}
a.tumblr_blog {border-bottom:1px solid rgba({RGBcolor:Hover},0.5);}

/* Etc */

img {margin:0;display:block;}

</style>
</head>
<body class="{select:Font}">

<div class="center {select:Permalink}">

<aside class="{select:Navigation}">
{block:ifSidebarImage}
<div class="image"><a href="/"><img src="{image:Sidebar}"/></a></div>
{/block:ifSidebarImage}

{block:ifTitle}<h1><a href="/">{Title}</a></h1>{/block:ifTitle}
{block:Description}<div class="desc">{Description}</div>{/block:Description}

<nav>
<a href="/">index</a>
<a href="/ask">contact</a>
{block:ifDropLinks}
<a href="#" class="lh">navigate</a>
{/block:ifDropLinks}
{block:ifnotDropLinks}
{block:ifLink1}
<a href="{text:Link 1}">{text:Link 1 Title}</a>
{/block:ifLink1}{block:ifLink2}
<a href="{text:Link 2}">{text:Link 2 Title}</a>
{/block:ifLink2}{block:ifLink3}
<a href="{text:Link 3}">{text:Link 3 Title}</a>
{/block:ifLink3}{block:ifLink4}
<a href="{text:Link 4}">{text:Link 4 Title}</a>
{/block:ifLink4}
{/block:ifnotDropLinks}
<a href="/archive">history</a>
{block:ifDropLinks}
<div class="lb">
{block:ifLink1}
<a href="{text:Link 1}">{text:Link 1 Title}</a>
{/block:ifLink1}{block:ifLink2}
<a href="{text:Link 2}">{text:Link 2 Title}</a>
{/block:ifLink2}{block:ifLink3}
<a href="{text:Link 3}">{text:Link 3 Title}</a>
{/block:ifLink3}{block:ifLink4}
<a href="{text:Link 4}">{text:Link 4 Title}</a>
{/block:ifLink4}
</div>
{/block:ifDropLinks}
</nav>
</aside>

<div id="content">
{block:Posts}
<div class="entry" id="{PostID}">
<div class="entry_hold">

{block:IndexPage}
<div class="psid">
<a href="{Permalink}"><b>{FormattedNoteCount}</b></a>
<a href="{Permalink}">{DayofWeek}</a>

<div class="pbutts">
<div class="custom-like-button">{LikeButton}
<span class="our_button"><i class="fa fa-heart"></i></span>
</div>
<a href="{ReblogURL}"><i class="fa fa-retweet"></i></a>
</div>

{block:HasTags}<div class="tags sid {select:Tags}">
{block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
</div>{/block:HasTags}
</div>
{/block:IndexPage}

{block:Text}
<div class="txt">
{block:Title}<h2>{Title}</h2>{/block:Title}
{Body}
</div>
{/block:Text}

{block:Link}
<div class="txt">
<h2><a title="{URL}" href="{URL}">{Name} <i class="fa fa-angle-right"></i></a></h2>
{block:Description}{Description}{/block:Description}
</div>
{/block:Link}

{block:Photo}
<div class="bx"><a href="{Permalink}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" class="photo"/></a></div>
{/block:Photo}

{block:Photoset}
<div class="bx"><div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div></div>
{/block:Photoset}

{block:Quote}
<div class="qut_hold">
{block:Source}<div class="src">{Source}</div>{/block:Source}
<div class="qut">{Quote}</div>
</div>
{/block:Quote}

{block:Chat}
<div class="chat">
{block:Title}<h2>{Title}</h2>{/block:Title}
{block:Lines}<div class="lines {Alt}"><div class="{Alt} user_{UserNumber}">{block:Label}<b>{Label}</b> {/block:Label}{Line}</div></div>{/block:Lines}
</div>
{/block:Chat}

{block:Audio}
<div class="audio">
{block:AudioPlayer}<div class="play">{AudioPlayerGrey}</div>{/block:AudioPlayer}
<div class="au">
{block:TrackName}<span class="tn">{TrackName}</span>{/block:TrackName}
{block:Artist}<span>by {Artist}</span>{/block:Artist}
</div>
</div>
{/block:Audio}

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

{block:Answer}
<div class="ask">
<div class="aski"><img src="{AskerPortraitURL-24}">{Asker} said:</div>
<div class="que">{Question}</div>
</div>
<div class="txt">{Answer}</div>
{/block:Answer}

{block:Caption}<div class="cap {select:Captions}">{Caption}</div>{/block:Caption}

</div>

{block:IndexPage}
<div class="pbot">
<div class="ple">
<a href="{Permalink}">{NoteCountWithLabel}</a> <b>on</b>
<a href="{Permalink}">{DayofWeek}</a>
</div>

<div class="pri">
<div class="custom-like-button">{LikeButton}
<span class="our_button"><i class="fa fa-heart"></i></span>
</div>
<a href="{ReblogURL}"><i class="fa fa-retweet"></i></a>
</div>

{block:HasTags}<div class="tags {select:Tags}">
{block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
</div>{/block:HasTags}
</div>
{/block:IndexPage}



{block:PermalinkPage}
{block:Date}
<div class="pph">
<div class="perma">
posted {TimeAgo} on {DayofMonthWithSuffix} {Month}
{block:RebloggedFrom}<br>
via <a href="{ReblogParentURL}">{ReblogParentName}</a> &nbsp;&nbsp;&nbsp;
source <a href="{ReblogRootURL}">{ReblogRootName}</a>
{/block:RebloggedFrom}

{block:HasTags}<div class="pmt">tags: &nbsp;
{block:Tags}<a href="{TagURL}">{Tag}</a> {/block:Tags}
</div>{/block:HasTags}
<a href="#" class="pnh">{NoteCountWithLabel}</a>
</div>

{block:PostNotes}
<div class="pn">{PostNotes}</div>
{/block:PostNotes}

</div>
{/block:Date}
{/block:PermalinkPage}

{block:ContentSource}
<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
{/block:SourceLogo}
{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
{/block:ContentSource}

<!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->

</div>
{/block:Posts}

{block:ifPaginate}
{block:Pagination}
<div class="pag">
{block:PreviousPage}
<a href="{PreviousPage}"><i class="fa fa-angle-left"></i></a>
{/block:PreviousPage}

{block:JumpPagination length="3"}
{block:CurrentPage}
<span class="cp">{PageNumber}</span>
{/block:CurrentPage}
{block:JumpPage}
<a class="jp" href="{URL}">{PageNumber}</a>
{/block:JumpPage}
{/block:JumpPagination}

{block:NextPage}
<a href="{NextPage}"><i class="fa fa-angle-right"></i></a>
{/block:NextPage}
</div>
{/block:Pagination}
{/block:ifPaginate}

</div>

{block:ifnotPaginate}
{block:Pagination}
<div class="pag">
{block:PreviousPage}
<a href="{PreviousPage}" class="prev">back</a>
{/block:PreviousPage}
{block:NextPage}
<a href="{NextPage}" class="next">next</a>
{/block:NextPage}
</div>

{block:ifLoadMore}
<a class="load">Load More</a>
{/block:ifLoadMore}
{/block:Pagination}
{/block:ifnotPaginate}

</div>

<a href="#" class="top"><i class="fa fa-angle-up"></i></a>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
<script src ="//static.tumblr.com/fwgzvyf/l6jnyutne/shythemes.vr.js"></script>
<script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
<script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
<script>
$(document).ready(function(){
$('.photo-slideshow').pxuPhotoset({
lightbox: true,
gutter: '1px',
photoset: '.photo-slideshow',
photoWrap: '.photo-data',
photo: '.pxu-photo',
{block:ifnotRoundEdges}
rounded: false,
{/block:ifnotRoundEdges}
{block:ifRoundEdges}
rounded: 'corners',
borderRadius: '3px'
{/block:ifRoundEdges}
});
{block:ifnotPaginate}
var $container = $('#content');
$container.infinitescroll({
itemSelector: '.entry',
navSelector: '.pag',
nextSelector: '.next',
loadingImg: ' ',
loadingText: ' ',
donetext: 'No more posts' ,
bufferPx: 2000,
{block:ifLoadMore}
errorCallback: function(){
jQuery('.load').delay(50).fadeOut();
}
{/block:ifLoadMore}
},
function( newElements ) {
var $newElems = $( newElements );
var $newElemsIDs = $newElems.map(function(){
return this.id;
}).get();
$newElems.find('.photo-slideshow').pxuPhotoset({
lightbox: true,
gutter: '1px',
photoset: '.photo-slideshow',
photoWrap: '.photo-data',
photo: '.pxu-photo',
{block:ifnotRoundEdges}
rounded: false,
{/block:ifnotRoundEdges}
{block:ifRoundEdges}
rounded: 'corners',
borderRadius: '3px'
{/block:ifRoundEdges}
});
resizeVideos();
console.log($newElems, $newElemsIDs);
Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
});

{block:ifLoadMore}
$(window).unbind(".infscr");
$(".load").click(function(){
$("#content").infinitescroll("retrieve");
});
{/block:ifLoadMore}

{/block:ifnotPaginate}
});



// scroll to top © html-tuts.com
var amountScrolled = 500;
$(window).scroll(function() {
if ($(window).scrollTop() > amountScrolled) {
$('a.top').fadeIn('slow');
} else {
$('a.top').fadeOut('slow');
}
});

$('a.top').click(function() {
$('body, html').animate({
scrollTop: 0
}, 'slow');
return false;
});



// drop links & post notes
$(document).ready(function(){
$(".pn").hide();
$(".pnh").show();$('.pnh').toggle(function(){
$(".pn").slideDown(function(){});
},function(){
$(".pn").slideUp(function(){});
});
$(".lb").hide();
$(".lh").show();$('.lh').toggle(function(){
$(".lb").slideDown(function(){});
},function(){
$(".lb").slideUp(function(){});
});
});



// tooltips
(function($){
$(document).ready(function(){
$("[title]").style_my_tooltips({
tip_delay_time:200,
tip_fade_speed:300
}
);
});
})(jQuery);

</script>
</body>
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 2 2016, 09:00 AM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6
Here it is.


QUOTE
/* Etc */

img {margin:0;display:block;}

</style>
</head>
<body class="{select:Font}">

<div class="center {select:Permalink}">

<aside class="{select:Navigation}">
{block:ifSidebarImage}
<div class="image"><a href="/"><img src="{image:Sidebar}"/></a></div>
{/block:ifSidebarImage}



You should place the player between <body> and </body>. Exactly where depends on where you want it to show up. Also, this isn't straight HTML. It's a tumblr template and much of that code will be replaced by real HTML before the page is served to the browser. So you need to try to figure out what is on the real page. Like in my quote above one can assume some kind of sidebar...
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Frederiek
post Jul 2 2016, 10:09 AM
Post #3


Programming Fanatic
********

Group: Members
Posts: 5,146
Joined: 23-August 06
From: Europe
Member No.: 9
As I understand Tumblr, users can edit pages, seeing the (maybe partially) real HTML in the provided editor for each page they open in it.

There's not much documentation at http://scmplayer.net , just a setup wizard to fill in (three steps in three tabs). There only seems to be a choice between top and bottom for the placement.

There's some documentation at https://github.com/cshum/SCM-Music-Player/ , though I'm not so sure if that'll help. I suppose the wizard should give you all you need.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Yukigo Inuoe
post Jul 3 2016, 09:16 AM
Post #4





Group: Members
Posts: 2
Joined: 2-July 16
Member No.: 24,387
QUOTE(pandy @ Jul 2 2016, 09:00 AM) *

Here it is.


QUOTE
/* Etc */

img {margin:0;display:block;}

</style>
</head>
<body class="{select:Font}">

<div class="center {select:Permalink}">

<aside class="{select:Navigation}">
{block:ifSidebarImage}
<div class="image"><a href="/"><img src="{image:Sidebar}"/></a></div>
{/block:ifSidebarImage}



You should place the player between <body> and </body>. Exactly where depends on where you want it to show up. Also, this isn't straight HTML. It's a tumblr template and much of that code will be replaced by real HTML before the page is served to the browser. So you need to try to figure out what is on the real page. Like in my quote above one can assume some kind of sidebar...


Thank you so much! You're a lifesaver. biggrin.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 3 2016, 08:32 PM
Post #5


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6
So it worked? Good. happy.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Jul 3 2016, 08:32 PM
Post #6


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6
So it worked? Good. happy.gif
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
2 User(s) are reading this topic (2 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: 24th April 2024 - 11:29 PM
Invision Power Board © 2024  IPS, Inc.
Licensed to: HTMLHelp.com, LLC