xHurricaneZ
New Member
- Aug 15, 2013
- 24
- 4
I've been trying to edit my community page by moving the news article to where the online users part is, and the online users to where the news articles would be. Basically just swapping their posistions. I've got it half way but I just need a little bit of help.
(took out the top part of the pages code cause its not really important, just my css and tabs, etc so you will need to place it underneath the coding for you navi-container 2)
Thanks for your help!
You must be registered for see links
Is how I've gotten it to look. The red lines and box is where I need the users box to be. I've deleted and added a couple of divs as well as moved a few things around and I haven't gotten anything. I'll place my pages code so you can have a look for yourself to see if you can do it.
Code:
<div id="container">
<div id="content" style="position: relative" class="clearfix">
<div id="column2" class="column">
<div class="habblet-container "></div>
<script type="text/javascript">if (!$(document.body).hasClassName('process-template')) { Rounder.init(); }</script>
<div class="habblet-container news-promo">
<div class="cbb clearfix notitle ">
<div id="newspromo">
<div id="topstories">
<div class="topstory" style="background-image: url({url}/r63/c_images/Top_Story_Images/{newsIMG-1})">
<h4>Latest news</h4>
<h3><a href="{url}/index.php?url=news&id={newsID-1}">{newsTitle-1}</a></h3>
<p class="summary">
{newsCaption-1}
</p>
<p>
<a href="{url}/index.php?url=news&id={newsID-1}">Read more »</a>
</p>
</div>
<div class="topstory" style="background-image: url({url}/r63/c_images/Top_Story_Images/{newsIMG-2}); display: none">
<h4>Latest news</h4>
<h3><a href="{url}/index.php?url=news&id={newsID-2}">{newsTitle-2}</a></h3>
<p class="summary">
{newsCaption-2}
</p>
<p>
<a href="{url}/index.php?url=news&id={newsID-2}">Read more »</a>
</p>
</div>
<div id="topstories-nav" style="display: none"><a href="#" class="prev">« Previous</a><span>1</span> / 3<a href="#" class="next">Next »</a></div>
</div>
<ul class="widelist">
<li class="even"><a href="{url}/index.php?url=news&id={newsID-1}">{newsTitle-1} »</a><div class="newsitem-date">{newsDate-1}</div></li>
<li class="odd"><a href="{url}/index.php?url=news&id={newsID-2}">{newsTitle-2} »</a><div class="newsitem-date">{newsDate-2}</div></li>
<li class="odd"><a href="{url}/index.php?url=news&id={newsID-2}">{newsTitle-3} »</a><div class="newsitem-date">{newsDate-3}</div></li>
<li class="last"><a href="/news">More news »</a></li>
</ul>
</div>
<script type="text/javascript">
document.observe("dom:loaded", function() { NewsPromo.init(); });
</script>
</div>
<div id="container">
<div id="content" style="position: relative" class="clearfix">
<div id="column" class="column">
<div class="habblet-container ">
<div class="cbb clearfix activehomes ">
<h2 class="title">Random Users - Click Us!</h2>
<div id="homes-habblet-list-container" class="habblet-list-container">
<img class="active-habbo-imagemap" src="{url}/app/tpl/skins/Habbo/images/activehomes/transparent_area.gif" width="435px" height="230px" usemap="#habbomap" />
<?php
$getRandom = mysql_query("SELECT id,username,look,motto,account_created,online FROM users ORDER BY RAND() LIMIT 18");
$i = 0;
while ($randomHabbo = mysql_fetch_assoc($getRandom))
{
echo '<div id="active-habbo-data-' . $i . '" class="active-habbo-data">
<div class="active-habbo-data-container">
<div class="active-name ' . (($randomHabbo['online'] == "1") ? 'online' : 'offline') . '">' . $randomHabbo['username'] . '</div>
Habbo created on: ' . date('d M, Y', $randomHabbo['account_created']) . '
<p class="moto">' . $randomHabbo['motto'] . '</p>
</div>
</div>
<input type="hidden" id="active-habbo-url-' . $i . '">
<input type="hidden" id="active-habbo-image-' . $i . '" class="active-habbo-image" value="http://www.habbo.nl/habbo-imaging/avatarimage?figure=' . $randomHabbo['look'] . '&direction=4&head_direction=4" />';
$i++;
}
?>
<div id="placeholder-container">
<div id="active-habbo-image-placeholder-0" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-1" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-2" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-3" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-4" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-5" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-6" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-7" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-8" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-9" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-10" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-11" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-12" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-13" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-14" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-15" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-16" class="active-habbo-image-placeholder"></div>
<div id="active-habbo-image-placeholder-17" class="active-habbo-image-placeholder"></div>
</div>
</div>
<map id="habbomap" name="habbomap">
<area id="imagemap-area-0" shape="rect" coords="55,53,95,103" href="#" alt=""/>
<area id="imagemap-area-1" shape="rect" coords="120,53,160,103" href="#" alt=""/>
<area id="imagemap-area-2" shape="rect" coords="185,53,225,103" href="#" alt=""/>
<area id="imagemap-area-3" shape="rect" coords="250,53,290,103" href="#" alt=""/>
<area id="imagemap-area-4" shape="rect" coords="315,53,355,103" href="#" alt=""/>
<area id="imagemap-area-5" shape="rect" coords="380,53,420,103" href="#" alt=""/>
<area id="imagemap-area-6" shape="rect" coords="28,103,68,153" href="#" alt=""/>
<area id="imagemap-area-7" shape="rect" coords="93,103,133,153" href="#" alt=""/>
<area id="imagemap-area-8" shape="rect" coords="158,103,198,153" href="#" alt=""/>
<area id="imagemap-area-9" shape="rect" coords="223,103,263,153" href="#" alt=""/>
<area id="imagemap-area-10" shape="rect" coords="288,103,328,153" href="#" alt=""/>
<area id="imagemap-area-11" shape="rect" coords="353,103,393,153" href="#" alt=""/>
<area id="imagemap-area-12" shape="rect" coords="55,153,95,203" href="#" alt=""/>
<area id="imagemap-area-13" shape="rect" coords="120,153,160,203" href="#" alt=""/>
<area id="imagemap-area-14" shape="rect" coords="185,153,225,203" href="#" alt=""/>
<area id="imagemap-area-15" shape="rect" coords="250,153,290,203" href="#" alt=""/>
<area id="imagemap-area-16" shape="rect" coords="315,153,355,203" href="#" alt=""/>
<area id="imagemap-area-17" shape="rect" coords="380,153,420,203" href="#" alt=""/>
</map>
<script type="text/javascript">
var activeHabbosHabblet = new ActiveHabbosHabblet();
document.observe("dom:loaded", function() { activeHabbosHabblet.generateRandomImages(); });
</script>
</div>
<!--[if lt IE 7]>
<script type="text/javascript">
Pngfix.doPngImageFix();
</script>
<![endif]-->
<div id="footer" >
<?php include('footer.php'); ?>
<?php include('checktheban.php'); ?>
</div>
</body>
</html>
<script type="text/javascript">if (!$(document.body).hasClassName('process-template')) { Rounder.init(); }</script>
</div>
<script type="text/javascript">if (!$(document.body).hasClassName('process-template')) { Rounder.init(); }</script>
<br>
<div id="footer" >
<?php include('checktheban.php'); ?>
</div>
</body>
</html>(took out the top part of the pages code cause its not really important, just my css and tabs, etc so you will need to place it underneath the coding for you navi-container 2)
Thanks for your help!
