Is there a string of codes in themes to easily convert themes from FIXED WIDTH into FLUID ?
or is it more complicated ?
...found some nice themes but they are fixed width, and would like to convert them to fluid.
T.I.A.
Its actually easy. Most of it lies around changing the .container and .body width property in CSS to a percentage value.
If the theme uses a lot of images, it may not be suited for a fluid width so u can try to replace it using CSS.
This is the main part, please give the name of the theme.
That fixed too fluid is the container. is either width 1024px or width:100%
that is it really. Might not work on the Apart because that container is a little strange.
Headerinclude
This goes before "{$newpmmsg}":
<div class="ancho">
jQuery to change width:
<script type="text/javascript">
jQuery.noConflict();
jQuery(function($) {
$(".fluid").hide();
$(".fixed").click(function() {
$(".ancho").animate({width: "1024px"}, 800);
$(this).hide();
$(".fluid").show();
$.cookie("width","fixed", {expires: 365});
return false;
});
$(".fluid").click(function() {
$(".ancho").animate({width: "100%"}, 800);
$(this).hide();
$(".fixed").show();
$.cookie("width","fluid", {expires: 365});
return false;
});
if($.cookie("width") == "fixed") {
$(".fixed").hide();
$(".fluid").show();
$(".ancho").css("width","1024px");
};
});
</script>
Buttons (I put them in the breadcrumbs):
<a title="Fixed Style"></a>
<a title="Fluid Style"></a>
CSS for the "ancho" class:
.ancho {
margin: auto;
}
Also you need to have the jquery.cookie.js file in your jscripts folder (That file saves the cookie for the user).
And I think it's all... maybe you need to change some widths inside css and put %...
This isn't hard, and the way you change the width it's a modified version of the show/hide sidebar I have, and that code it's here in MyBB (I think in the tutorials forum).
Greetings.
P.D.: In any case, this isn't good, and that wasn't my original idea... because I really want to create a fluid theme but you can't figure out a % to fit on all the resolutions. I think it's better the new responsive design, because you can fit the global design in any resolution (So fixed-fluid thing it's old now).