Good day to you all.
I'm trying to put both contact form and newsletter subscribsion field into footer. I've got them down there, but I can't make them be in-line.
Here is my page.xml code:
<block type="page/html_footer" name="footer" as="footer" template="page/html/footer.phtml"> <block type="page/html_wrapper" name="bottom.container" as="bottomContainer" translate="label"> <block type="core/template" name="form" as="form" template="contacts/form.phtml"/> <block type="newsletter/subscribe" name="newsletter" template="newsletter/subscribe.phtml"/> <label>Page Footer</label> <action method="setElementClass"><value>bottom-container</value></action> </block>
footer.phtml:
<div class="footer-container"> <footer class="footer container"> <?php echo $this->getChildHtml() ?> </footer> </div>
And pictures. This one is as is, and this one is how I would like it to be (don't mind the CSS).
Also, I'm using Bootstrap, and my fieldset class is set to col-sm-8, while the subscription container (.block-subscribe) is on col-sm-4.
Any tips on this one would be more then welcome!
hi GoliZeka
Welcome to the forum :-)
First of all I want to give you a bit of advice in regards to your layout (XML) code. You very rarely need to change the default layout files including page.xml. Doing this might prevent your from upgrading your store in the future. You can create the same code from local.xml in your own template. Using this way also makes it easier for you to manage all your updates. The code would look something like this in local.xml
<?xml version="1.0" encoding="UTF-8"?> <layout> <default> <reference name="footer"> <block type="core/template" name="form" as="form" before="newsletter" template="contacts/form.phtml"/> </reference> </default> </layout>
Now for your actual question, I'm not that much into frontend development, but I will try and give you some advice anyway ;-) ... As far as I understand bootstrap have different classes for different device sizes. And according the articly I looked up about it here the -sm- in your device is a specific styling for small devices. And from your screenshots it looks like you are not on a small device but on a desktop computer.
Again I will not call myself a frontend developer but I hope this helps :-)
Is it fixed?