...

View Full Version : Adding Mooflow to my site



creativeedge
07-27-2011, 10:40 AM
I have designed a Mooflow document, which I will eventually have showing logos of current clients, the problem is that it messes up my site when I put it in.

creative.jigowatt.co.uk

I want it to appear under the 2 columns of text at the top like it is, but centred. When I insert it, it messes up the whole of my site? All the widget sections at the bottom disappear and the font of the text at the top changes too.
I am using wordpress and I am editing the theme to make it my own using dreamweaver.

Help please below is part of the code, my mooflow document is called index2.php


<!-- END #primary-nav -->
</div>

<!-- END #header-top .clearfix -->
</div>

<?php if(is_page_template('template-home.php')) : // if using the home template ?>

<?php include 'includes/header-slider.php'; // include the slider ?>

<?php include 'includes/index2.php'; // include the mooflow ?>

<?php else: // else if not home template ?>

<!-- BEGIN #header-title-wrap .clearfix -->

<div id="header-title-wrap" class="clearfix">
<?php include 'includes/header-title.php'; ?>
<!-- END #header-title-wrap .clearfix -->

I'm still very new to coding, I am learning fast but I am self teaching!

JustinJD
07-27-2011, 02:27 PM
Not being very experienced with Mooflow, I wouldn't know.
But it seams to me the images that are scrolling through initially load on different lines, which is pushing the footer of your website down. (this would depend more where you have added the content, then the actual php locations.

creativeedge
07-27-2011, 04:11 PM
Ok I can see how that may be true, however, this site uses it and it doesnt cause them issues?

www.esendex.co.uk/Customers

Im new to coding so Im not sure what I'm looking for in the code that stops it?

JustinJD
07-27-2011, 06:52 PM
They have probably set a max-height somewhere in there CSS code (which I can't look at)
Try setting a 'max-height on your #container :)

creativeedge
07-28-2011, 10:43 AM
hmm I tried adding a max-height but nothing? not sure if I've done it right, i tried it on all sections that are to do with size but nothings changed!?


#maincontent{
max-height: 355px;
width: 100%;
clear: both;
position: relative;
overflow: hidden;
padding: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#spinner{
width: 616px;
max-height: 355px;
background-color: #fff;
position: relative;
z-index: 1;
margin-top: -46px;
}

#mooflow-container{
max-height: 355px;
align: center;
width: 616px;
margin: 0 auto;
height: auto;
overflow: hidden;
}
#MooFlow{
/*margin-top: -21px;*/

thanks for your help :)

JustinJD
07-28-2011, 11:36 AM
Create a 'container' div and put everything inside of it, then give it a max-height. :)

creativeedge
07-28-2011, 12:35 PM
Okay so I'm doing something wrong!

This my body of my mooflow php


<body>
<div id="container">
<div id="mooflow-container">
<div id="MooFlow">
<div>
<div align="center"><img src="<?php bloginfo('template_directory'); ?>/images/golf_popup1.png" alt="Image" align="middle" title="My Title1" /></div>
</div>
<div>
<div align="center"><img src="<?php bloginfo('template_directory'); ?>/images/golf_popup2.png" alt="Image" align="middle" title="My Title2" /></div>
</div>
<div>
<div align="center"><img src="<?php bloginfo('template_directory'); ?>/images/golf_popup3.png" alt="Image" align="middle" title="dasdasdasdasdasdasdd" /></div>
</div>
<div>
<div align="center"><img src="<?php bloginfo('template_directory'); ?>/images/golf_popup4.png" alt="Image" align="middle" title="Masfasfasfas" /></div>
</div>
<div>
<div align="center"><img src="<?php bloginfo('template_directory'); ?>/images/golf_popup5.png" alt="Image" align="middle" title="asfafsafsaf" /></div>
</div>
<div>
<div align="center"><img src="<?php bloginfo('template_directory'); ?>/images/golf_popup6.png" alt="Image" align="middle" title="dasdasdasdasdasdasdd" /></div>
</div>
<div>
<div align="center"><img src="<?php bloginfo('template_directory'); ?>/images/golf_popup7.png" alt="Image" align="middle" title="Masfasfasfas" /></div>
</div>
<div>
<div align="center"><img src="<?php bloginfo('template_directory'); ?>/images/golf_popup8.png" alt="Image" align="middle" title="asfafsafsaf" /></div>
</div>
<div>
<div align="center"><img src="<?php bloginfo('template_directory'); ?>/images/golf_popup9.png" alt="Image" align="middle" title="dasdasdasdasdasdasdd" /></div>
</div>
</body>

and this is my css


body{
padding:0;
font-size: 75%;
background-image: url(images/background_01.jpg);
background-repeat: repeat;
background-position: center;
margin-top: 0;
margin-right: 30;
margin-bottom: 0;
margin-left: 30;
}

h1, h2, h3, h4, h5, h6, address, blockquote, dd, dl, hr, p, form{
margin:0;
padding:0;
}
#container{
max-height: 355px;
}
#maincontent{
max-height: 355px;
width: 100%;
clear: both;
position: relative;
overflow: hidden;
padding: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#spinner{
width: 616px;
max-height: 355px;
background-color: #fff;
position: relative;
z-index: 1;
margin-top: -46px;
}

#mooflow-container{

margin: 0 auto;
height: auto;
overflow: hidden;
}
#MooFlow{
/*margin-top: -21px;*/

theres more css but I think thats the only relevant part for sizing

Im a graphic designer but I've never done coding before and Im learning quick but as I say self teaching so a lot of it is guess work!

Thanks for your patience and help :)

JustinJD
07-28-2011, 01:58 PM
Alright, I understand.
We all had to of started somewhere. ^_^

Hmm, okay, i hope you closed off #MooFlow{ for starters.

I just read over what you said on the first post, and I hope you're not rearranging things with the graphical interface on dreamweaver (that's a no-no when you include CSS)

I'm looking at your site at the moment, and I've noticed that there is actually content and pictures under your actual black div under the footer.. are they suppose to be there? if not, try and find the content and delete it, and it'll fix itself.

creativeedge
07-28-2011, 02:28 PM
Hehe I'm learning :)

Graphical Interface? Is that the Design section. Im just using the code editor?
Yer #MooFlow{ is closed off I just missed it when I copied the code
Yer the stuff under the black is supposed to be there, the site only messes up when I put the mooflow in!?

JustinJD
07-28-2011, 03:02 PM
Try and actually set a min-height, for your main content.

I'm going to be honest with you, I have no idea about MooFlow, but have good knowledge of CSS and HTML.. So I'm just throwing ideas out there. :P

creativeedge
07-28-2011, 03:20 PM
:) Any help helps lol!

No luck with that either!
I might just finish making the mooflow and get someone who knows what theyre doing to put it on the site for me lol!

Thanks for your help :)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum