How can I add a full width row under the footer?


Author Message
Robert Lowly

Posted: 6/28/2014
Quote message 

Hi all, I would like to know if it's possible to add a full-width row under the footer area.... currently i am only able to add it when the footer is page-width, but when it's full width, any row placed under the footer is in the sheet width...
Perhaps jrgweb the master knows how to do it?

In case you need an example of what i mean, I will add one...
 
jrgweb

Posted: 6/28/2014
Quote message 

@Robert Lowly - Since were in the General forums, this example is for static websites.
For HTML:

add this script in the footer area.

<script type="text/javascript">
$(document).ready(function() {
$("<div><\/div>").attr('id','footer2').insertAfter('.art-sheet');
$('#footer2').append('<div class="footer2"><div><span>Description for "About"<\/span><\/div><\/div>');

});
</script>
The above script creates a div with the id footer2 and creates another div within the first created div and names the class as footer2.

add the css:

#footer2 {
width: 100%;
background-color:#000000;
color:#FFFFFF;
padding: 10px;
}
.footer2 {
width:1024px!important;
margin-left: auto;
margin-right: auto;
text-align: center;
min-height: 75px;
}

example:
http://demo.artisteertoday.com/bottom_position/

There are other ways of doing this but this should give an idea.
 
Robert Lowly

Posted: 6/28/2014
Quote message 

Hi Jrgweb, I just tried it and it works great!, though now i have two questions...

1. is there any way to style the area of the new footer? like adding texture or gradient, and maybe putting 3 cells there to edit ?

2. it will probably sounds strange, but is there any way to perhaps add the footer class to rows i want to be full width but with a smaller sheet width?, like in the middle of the content or something? i hope you understood what i ment...

Thanks so much for your help man, I really appreciate it!!! 8-)
 
jrgweb

Posted: 6/30/2014
Quote message 

@Robert Lowly - As I mentioned above, there are many ways to accomplish what you want depending on the variables.
Like what version of artisteer and is this for a cms or static website.
Are you using sidebars and is this fixed or fluid.

But to give you a hint on the footer editing, artisteer allows you to add cells and style the rows and even give it a id. Is the footer page wide or sheet wide?

Let me know what your requirements are and if time permits, I'll work up an example.






 
Robert Lowly

Posted: 6/30/2014
Quote message 

Hi Jrgweb, thanks for the information :)
I am working in artisteer 4.2 , mostly in wordpress, but i assume the code you gave here will work in wordpress no problem..


I am working on a fixed site, no fluid and no sidebar..... ( i am not sure if it works good, or maybe you have good exmaples for sites you did which are fluid?)
as for what you wrote on the footer editing, I hope i know what you mean....
to style another row and than check it with all its html and than copy paste it inside the js in the head?

I tried doing something like this, but it didn't work to good.... but if the footer can do full width rows with texture and stuff, i assume there is some way to give rows inside the content some elements from the footer's code or something like this?

I wish artisteer whould implement this behaviour in the software. In themler ( I assume you know what I mean), they have an option to check full width length for a row, like you choose the header widthto full length and than you can do it.....

If we could find the equivelant code in css or js to do this, it would be the bomb :) ofcourse i tried the code you gave me last time in my full width rows question, i was just curious if the footer's behaviour regarding this can be implemented inside the content when it's not 100% fluid...

Thanks for bearing with me man :)
 
Robert Lowly

Posted: 6/30/2014
Quote message 

that's my longest post until now 8-)
 
jrgweb

Posted: 7/1/2014
Quote message 

@Robert Lowly - Hey Robert, I haven't finished the example yet but you can see a preview in wordpress for the footer. This was added in artisteer, then I added the .fluid and .fluid-inner classes in wordpress since it's so easy to edit in wordpress. You could add the classes with jquery but not needed.

In artisteer I gave all rows an ID which allows me to customize the entire page if needed.

http://wordpress.artisteertoday.com/

Here is a preview image of a row in the content area that expands the full screen width and also the footer expands the full with while the sheet remains at 800px. The background color of the rows can easily be styled to any color.
In each row you can adjust the width per row. For example: Lets say the full content row is 800px width, and lets say I want the footer row at 1000px width. I simply adjust this with the row ID.




Anyway, I'll continue working when time permits. :-)


 
jrgweb

Posted: 7/2/2014
Quote message 

@Robert Lowly

Artx download: http://demo.artisteertoday.com/fluid_fixed1a.artx

I inserted a script in the footer to automatically add 2 classes in row3.
In the footer, once in wordpress I manually added the 2 classes so that the rows will be fluid.

You don't have to use the script.

After downloading the artx, pay close attention to the rows in the layout. I gave each row an ID. This was accomplished through artisteer.



It may look a little off in artisteer but once previewed it should look fine.

I did not adjust the content fluid for responsive but the footer should work for responsive.
I also did not style the blog section for fluid rows.

Anyway, this should give a good idea of what can be done.
 
jrgweb

Posted: 7/2/2014
Quote message 

@Robert Lowly

example: http://wordpress.artisteertoday.com/
 
Greg

Posted: 7/27/2014
Quote message 

jrgweb.

that example site is exactly what i've been looking to make in 4.2 . Really cool. I downloaded your example .artx file, but can't figure 'how' you went from that in the .artx file to the site http://wordpress.artisteertoday.com .

Is there some kind of tutorial for this kind of site for artisteer? thanks for the great work!

Greg
 
jrgweb

Posted: 7/28/2014
Quote message 

@Greg
I'll get back to you later today or tomorrow. Pushed for time today. :(
 
jrgweb

Posted: 7/28/2014
Quote message 

thanks jrgweb!

I look forward to it
 
Carin

Posted: 8/4/2015
Quote message 

Hello jrgweb!

Your solution you posted in your first reply - where does one put that script exactly? Do i put it in the HTML on every page?

Thank you!