DDDproduktionen
  • Home
  • Web Design
  • SEO
  • Video
  • About us
  • Blog

How to remove and replace the Weebly footer with a free Weebly account?

30/1/2012

289 Comments

Picture
Follow the next steps to remove the Weebly footer and replace it by your own.

It’s easy to modify the footer with a pro account, but it is possible to do it with a free account.


What do you have to do?

Go to Design (on top of the page) >Edit HTML/CSS (bottom left) > Open one of the four html files (under Page layouts)  

Search for the footer and you will see something like this (this may differ a bit depending on your theme):

Video tutorial



<div id="footer">
<div id="footer-content">{footer}</div>
  

Now add a line between the last footer div and {footer}.

Add this line <div style="visibility:hidden">

It should look like this after you’ve done that: 

<div id="footer">
<div id="footer-content">
<div style="visibility:hidden">
{footer}</div>

Now you removed the footer and you can start building up your own.

Add a new line before <div style="visibility:hidden">

© 2016 “your name and other text”

If you want to add links in your footer copy this code:

<a href="Your link">Name you want to use </a>

After you finished all this it could look like this (example of my site) :

<div id="footer">
<div id="footer-content">
© 2016 DDDproduktionen |
<a href="http://dddproduktionen.weebly.com/contact.html">Contact</a> |
<a href="http://dddproduktionen.weebly.com/privacy.html">Privacy</a> |
<a href="http://dddproduktionen.weebly.com/sitemap.html">Sitemap</a> </div>
<div style="visibility:hidden">
{footer}
</div>

Note for new themes:

I noticed that some people have problems because new themes use wrappers.

For example:

<div id="footer-wrap">
<div class="container">
{footer}
</div><!-- end container -->
</div><!-- end footer-wrap -->

Replace this code by the following code:

<div id="footer-wrap">
<div class="container">
"your name and links"
<div style="visibility:hidden">
{footer}
</div><!-- end container -->
</div><!-- end footer-wrap -->

Click here for the video tutorial: http://www.youtube.com/watch?v=o4wQX2up3Ew

DDDproduktionen 
289 Comments
Shaliny Guda
1/3/2012 04:11:57 am

Thank you so much it worked!!!! I watched so many tutorials about this topic but none of them worked.

Reply
DDDproduktionen
3/3/2012 04:54:03 am

I'm glad it worked out for you.

Reply
jay link
18/3/2015 12:48:07 pm

i have a question is there any way to make the text align to center?

Reply
DDDproduktionen
17/4/2015 05:18:32 am

Yes, you can change that in the css. Just look up the css for the footer, and change text-alignment.

Rat
29/5/2012 06:13:56 pm

Thanks,friend.It works great! :)

Reply
Alex link
31/5/2012 02:58:34 am

Thank you very much! I looked so long for this! I have one question i set my link color into red but the link color in the footer is blue (standard from my chosen Theme), can you help me? And one ore i have seen that you have a breadcrumb navigation? How you have done this? can you make a tutorial? Thank you very much!

Reply
DDDproduktionen
2/6/2012 05:06:24 am

Alex, search for this line in the html code: a:link,a:hover,a:visited, and there you can set your color into red.

You will have to make the breadcrumbs yourself. It's just text with links on it. After you made one example, you can copy this on other pages.

Reply
Rat
12/6/2012 08:09:47 pm

Is there any way by which I can replace Navigation menu text by pictures?

Reply
DDDproduktionen
13/6/2012 01:20:50 am

I don't think you can do that. Or you would have to make it yourself, like breadcrumbs.

Reply
Rat
1/7/2012 04:12:56 am

Can you please tell me how to do that?

DDDproduktionen
1/7/2012 09:22:32 pm

You will have to make it like this (the way how I made my social media buttons):

1) Hide every page

2) Search for <div id="navigation">
{menu}
</div>

3) Add this line under {menu}

4) <div id="navigation">
{menu}
<a href="LINK TO THE PAGE ON YOUR WEB SITE" target="_blank"> <img src="/files/theme/PICTURE YOU UPLOADED ON WEEBLY" border="0" width="MAKE IT FIT" height="MAKE IT FIT"> </a>

Reply
Rat
10/7/2012 09:10:41 pm

Thanks,but please tell me how to increase the space between navigation menu items.

DDDproduktionen
10/7/2012 11:20:15 pm

To increase the space between the images, just add : style="padding: 0px 5px;" after the width and height.

Rat
12/7/2012 01:08:32 am

Thanks it worked.:) but sub-menus are not appearing under the images.How can i do that?

DDDproduktionen
13/7/2012 12:31:47 am

You can't use the sub-menus from Weebly. You will have to build your own using html (not so easy).

Rat
13/7/2012 10:51:03 pm

Let it be.Thanks :)

Hex link
19/6/2012 01:33:45 am

In the new layout , after clicking the Edit HTML/CSS, a CSS stylesheet opens not Index.html.
Plz help

Reply
DDDproduktionen
21/6/2012 06:29:11 pm

Hex, to open index.html, you have to click the html-files under page layouts.

Reply
PJS link
22/6/2012 01:18:28 pm

Thanks for this great information.... I just tried and its work.... Now my weebly site looks like a pro one.... But I have a question, is there any risk or getting banned for removing its footer?

Reply
DDDproduktionen
22/6/2012 10:52:13 pm

I don't think they will ban you. The footer is just hidden, You can put it back if needed.

Reply
PJS link
23/6/2012 06:29:49 pm

Thanks for your response and answer..... :))

bt link
27/6/2012 10:08:44 am

It worked! But is it possible to change the colour of the font? My background is white and the footer bar is black. I can only see my links that I added.

Thanks so much.

Reply
DDDproduktionen
9/7/2012 11:24:28 pm

Yes you can change the colour of the font.
Add a line in your css file. Search for the footer and add color.

#footer {
color: #FFF;

Reply
Rajat
13/7/2012 10:50:17 pm

Comment deleted

Reply
DDDproduktionen
14/7/2012 01:17:53 am

Comment deleted

Reply
patrick link
30/7/2012 10:25:06 am

???

Lisa Stover
19/7/2012 06:10:03 pm

I have CSS also so I went under tall-header.html to try to change it. This is what I get it shows:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body class='wsite-theme-light tall-header-page'>
<div id="topgap"></div>
<div class="wrapper">
<table id="header">
<tr>
<td id="logo">{logo}</td>
<td id="header-right">
<table>
<tr>
<td class="phone-number">{phone:text}</td>
<td class="social">{social}</td>
<td class="search">{search}</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
<div class="outer-wrapper-main">
<div class="wrapper">
<div id="navigation">{menu}</div>
<div class="clear"></div>
<div id="banner-container">
<div id="banner">
<div id="banner-top">
<div id="banner-btm">
<div class="wsite-header"></div>
<div class="clear"></div>
</div>
</div>
</div>
</div>
<div id="content">
{content}
<div class="clear"></div>
</div>
<div id="footer">
{footer}
</div>
<div class="clear"></div>
</div>
</div>
<div id="btmgap"></div>
</body>
</html>

I don't know where to change it. I've watched so many videos on how to change this but none match what mine says and nothing ever works. So, I figured I'd paste it and see what you say to do. I hope you don't mind. Thanks.

Reply
DDDproduktionen
19/7/2012 11:17:04 pm

Find your footer div: (in your case)

<div id="footer">
{footer}
</div>

Delete it and put this code instead:

<div id="footer">
<div class="site_footer" style="height:30px" align="center"> © 2012 Your Name
<div id="footer-content" style="visibility:hidden">{footer}</div>

Reply
lalitha link
25/7/2012 04:02:05 pm

need to create a footer like in www.fortworthhindutemple.org website

Reply
umair link
16/8/2012 04:22:50 pm

o man u r not great
.............................u r sooo gtreat
love u man thanx alot. you r realy jenius

Reply
arvinder
10/9/2012 12:32:26 am

i couldn't find the
<div id="footer">
{footer}
</div>
plz help

Reply
DDDproduktionen
10/9/2012 12:52:47 am

Are you sure you looked at the html files (under page layouts), you won't find it in the css.

Reply
Arvinder link
13/9/2012 09:44:00 pm

yes

Reply
John
13/10/2012 01:38:36 pm

Hi!
I'd like to thank you for making this blog post. Hopefully it helps a lot of people.

I have used the visibility;hidden code before but now I am interested in making a custom footer. I have tried your technique but I am convinced it doesn't work anymore or I am doing it wrong. I hope it's the latter.

If you can check my code to see if I followed the syntax correctly:
#footer {
visibility:hidden;

<div class="site_footer" style="height:30px"align="center"> © 2012 “your name”</div>
padding: 45px 0 50px 0;
font-size: 12px;
color: #fff;
font-family: Arial, Helvetica, sans-serif;text-align: right;

Thanks for your help!

Reply
DDDproduktionen
13/10/2012 11:03:19 pm

It looks like you are working in the CSS-file. You have to open one of the four HTML-files. Than it should work perfectly.

Reply
John
14/10/2012 04:37:34 am

Oooh, that makes more sense. I tried it in the HTML file but it still doesn't work. I'll continue playing around with it though.
Thanks again for your help!

walster001 link
14/12/2014 04:39:45 am

Also, You are putting the footer info (div class=blah blah blah) after the visibility hidden, In the page files. Always put the custom footer information first :)

Reply
Paul link
29/10/2012 08:56:02 pm

Great, thanks!

Replacing footer works like charm. Is there a way to do the same on the mobile version of my weebly-site?

Reply
DDDproduktionen
30/10/2012 11:57:52 pm

No, you can't.

Reply
Paul link
31/10/2012 12:03:27 am

That's a pity.

Thanks anyhow!

Kyle link
31/10/2012 06:04:24 pm

Hi, could you please tell me how to make the footer the same on every page, as it only shows on the home page, and it comes up with 'make a free site with weebly', on every other page. - Thanks

Reply
DDDproduktionen
1/11/2012 07:52:46 am

Hi Kyle, I think your using a different page layout for your homepage (you can look it up under the tab "pages"). So you will have to make the changes in the other html files. The best thing you can do is to copy the code and paste it in all the html files, to prevent problems in the future.

Reply
Kyle
2/11/2012 11:24:39 am

Ok. Thanks! :)

CruiseKidz link
9/11/2012 03:25:21 pm

Hi, could you please advise me whether there is a way to use a certain font on a webpage, e.g.) FS Lola??? - Thanks!

Reply
DDDproduktionen
9/11/2012 10:17:35 pm

There is a way using the html-element.

Paste this in the CSS:
.text-paragraph{
font-family: "FS lola";
font-size: 13px;
}

Paste this in the html-element:
<div class="text-paragraph">YOUR TEXT</div>

(You replace "YOUR TEXT" with your content)

It's not ideal, but it's the only way I know.

Reply
CruiseKidz
11/11/2012 07:00:11 pm

Ok, thank you for all your help! :)

CruiseKidz link
11/11/2012 07:08:57 pm

Hi, could you please tell me where I paste

.text-paragraph{
font-family: "FS lola";
font-size: 13px;
}

in the CSS?
- Thanks

DDDproduktionen
11/11/2012 08:13:41 pm

The place is not so important. You can put it anywhere.

(Go to Design (on top of the page) >Edit HTML/CSS (upper right corner) > Open CSS)

kj31 link
12/11/2012 07:17:34 am

Hi DDDProduktionen,

Could you please help me with the embedded font situation, because it only uses "FS Lola" as the footer text and not the titles or body paragraphs. - Thanks

DDDproduktionen
12/11/2012 10:26:51 pm

Seems like you changed the p class, but that's not working. You will have to do it by adding custom html elements like mentioned above.

worldquest link
11/11/2012 10:58:19 pm

How can i add custom weebly footer from the mobile version of weebly?

Reply
DDDproduktionen
12/11/2012 03:09:09 am

You can't do that.

Reply
Ryan link
21/11/2012 06:14:55 pm

Hi,

Under Page Layouts, the only html options are tall-header.html, short-header.html, no-header.html, and landing.html. I don't see index.html selection. Do I need to make an index.html page since it doesn't exist?

Thanks,
Ryan

Reply
DDDproduktionen
22/11/2012 02:48:25 am

No, that's only for the old themes. They don't have tall-header.html, short-header.html, no-header.html, and landing.html, but only index.html.

Reply
Margaret Newcomb link
22/11/2012 05:35:22 am

my site is not up and ready, still working on it. However; finally today I was able to get the FLEXI footer in there, my problem is - it is stuck to the left of the screen on all the pages, it is not centered nor going all the way across the page design. Can you help? Thanks so much, Margaret

Reply
DDDproduktionen
23/11/2012 03:47:33 am

I'm not familiar with the flexi footer. I suppose it is a new div. So you can add margin, padding and width in the CSS. Be sure to close the div before the new footer div (even multiple closing divs if necessary).

Reply
TeenScripts
23/11/2012 09:22:06 am

I can't believe I didn't try that before!
All the stupid YouTube video's tried to make me do it in the CSS code but Weebly patched that. Nice Job! AND THANK YOU!

Reply
Gabe link
22/12/2012 05:27:11 am

I was reading your post abot removing the weebly footer on a free account and i was wondering will i get in trouble with weebly because i removed the weebly footer on my website? please write back thanks.

Reply
DDDproduktionen
23/12/2012 02:24:44 am

No, I don't think so. The weebly footer is only hidden. You can always put it back.

Reply
MrDuan link
30/12/2012 06:40:40 am

Hi bro . It doesnt work anymore. i cant find anything like footer content , man. all i see here. Please help me


#footer-wrap {
background:url(footer-bg.jpg) repeat;
text-align:right;
margin-top:10px;
font-size:15px;
font-weight:normal;
color:#777777;
}

#footer-wrap-inner {
background:url(footer-top-bar-decoration.jpg) repeat-x top;
position:relative;
top:-10px;
height:10px;
}

#footer-wrap .container {
padding:10px 0px 25px;
color:#aaaaaa;
}
#footer-wrap .wsite-form-container {
margin-top:0px !important;
}

#footer-wrap h2 {
color:#fff;
font-size:18px;
}

#footer-wrap .paragraph ul {
padding-left:5px !important;
}

#footer-wrap .paragraph li {
list-style:none !important;
background:url(bullet-footer.png) no-repeat 0px 1px;
padding-left:32px !important;
padding-top:2px;
margin-bottom:10px !important;
}

#footer-wrap .paragraph li a{
color:#777777;
}

#footer-wrap .paragraph li a:hover{
color:#47b403;
}

#footer-wrap .wsite-form-container {
text-align:left;
}

#footer-wrap blockquote {
font-style:italic;
border-left:4px solid #555;
margin:10px 0 10px 0;
padding-left:20px;
line-height:1.5;
color:#888;
}

Reply
Paul link
30/12/2012 06:16:39 pm

You don't need to worry about CSS just HTML - My Website is in dev but this is how I got it to work:

From this:
<div id="footer-wrap">
<div id="footer-wrap-inner"></div>
<div class="container">
{footer}
</div>
</div>

To This:
<div id="footer-wrap">
<div id="footer-wrap-inner"></div>
<div class="container" >© 2013 'Your Text Here'
<div style="visibility:hidden">{footer}</div>
</div>
</div>

Each theme is slightly different now in terms of div names but the same roughly goes I think. Also make sure to change it in all four headings if your using the 4 styles. I am only using 'no header' so only did it on that one.

Reply
Ipsy
2/1/2013 11:58:57 pm

Hello,

I pasted the code as mentioned above and it does get rid of the weebly footer but it also reduces the footer_wrap.png and leaves a grey rectangle. Would you mind enlightening me please? I want to get rid of the weebly footer but not the image.

Thanks for taking the time.

This is the original code:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body class="wsite-theme-light no-header-page">
<div id="header-wrap">
<div id="page">
<table id="header">
<tr>
<td id="logo">{logo}</td>
<td id="header-right">
<table>
<tr>
<td class="phone-number">{phone:text}</td>
<td class="social">{social}</td>
</tr>
</table>
<div class="search">{search}</div>
</td>
</tr>
</table>
</div>
</div>
<div id="main-wrap">
<div id="page">
<div id="main">
<div id="topnav">
{menu}
<div style="clear:both"></div>
</div>
<div id="banner-bot">
<div id="banner">
<div id="banner-mid">
<div id="banner-b">
<div id="banner-r">
<div id="banner-wrap">
<div class="wsite-header"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="content">{content}</div>
</div>
</div>
</div>
<div id="footer-wrap">
<div id="page">
<div id="footer">{footer}</div>
</div>
</div>
</body>
</html>

Reply
DDDproduktionen
3/1/2013 07:00:35 pm

You should give your footer image a fixed height in the CSS.

Reply
Ipsy
4/1/2013 12:38:11 am

Aha!
Thank you very much.

Gabe link
11/1/2013 02:41:10 am

I am trying to remove my footer but all i see in my css code is #footer{
width: 960px;
font-size: 12px;
text-align: right;
padding: 20px 0px 30px 0px; how do i edit the footer if all i see is that code?

Reply
DDDproduktionen
11/1/2013 08:54:50 pm

You don't need the CSS code. But the HTML files under Page Layouts.

Maybe this video can help:
http://www.youtube.com/watch?v=30cAQDj4f6M

The best thing you can do is to change it in all four headings.

Reply
Rydan link
13/1/2013 05:00:28 am

I agree, I've researched this so many times the past few days and the way you described is by far the BEST I'VE SEEN! Thank you so much!

Reply
ishak
16/1/2013 10:16:09 pm

hey friends,can any one tell,how to remove weebly footer in each pages

Reply
DDDproduktionen
17/1/2013 08:39:56 pm

Just change the footer code in all four headings.

Reply
Ryan Williams link
18/1/2013 10:17:44 pm

Hello DDDproduktionen!

I'm kinda stuck, check this out.... have they modified it for 2013 already? i can't seem to get rid of the 'create a free blah blah blah'

Cheers in advance boss!




<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>

<body class='landing-page wsite-theme-light'>
<div id="header-wrap">
<div class="container">
<table id="header">
<tr>
<td id="logo">{logo}</td>
<td class="header-right">
<table>
<tr>
<td class="social">{social}</td>
</tr>
</table>
</td>
</tr>
</table>
</div><!-- end container -->
</div><!-- end header-wrap -->

<div id="nav-wrap">
<div class="container">
<table id="nav-table">
<tr>
<td>{menu}</td>
<td class="header-right">
<table>
<tr>
<td class="phone-number">{phone:text}</td>
<td class="search">{search}</td>
</tr>
</table>
</td>
</tr>
</table>
</div><!-- end container -->
</div><!-- end nav-wrap -->

<div id="banner-wrap">
<div class="container">
<div id="banner">

<div id="bannerleft">
<div class="wsite-header"></div>
</div><!-- end banner-left -->

<div id="bannerright">
<h2>{headline:text global="false"}</h2>
<p>{headline-paragraph:text global="false"}</p>
{action:button global="false"}
</div><!-- end banner-right -->

<div style="clear:both;"></div>
</div><!-- end banner -->
</div><!-- end container -->
</div><!-- end banner-wrap -->

<div id="main-wrap">
<div class="container">
{content}
</div><!-- end container -->
</div><!-- end main-wrap -->

<div id="footer-wrap">
<div class="container">
{footer}
</div><!-- end container -->
</div><!-- end footer-wrap -->

</body>

</html>

Reply
DDDproduktionen
18/1/2013 11:26:47 pm

It still works.

Search for this:
<div id="footer-wrap">
and change it to this:
<div id="footer-wrap" style="visibility:hidden">

(do this in all the headings you use)

and for the modification:

<div id="footer-wrap">
<div class="container">
"your name and links"
<div id="footer-wrap" style="visibility:hidden">
{footer}

Reply
Waqas
19/1/2013 03:32:26 pm

Oh great man absolutely great love your ass thank you baby :) :) :) :):) :):) :):) :)

Reply
Gaurav Jain link
12/2/2013 04:29:44 pm

Not Able to remove weebly footer Please help me I have to Modify the Weebly Footer according to My Style Please help me as soon as possible ad i also want to Know the code For the scroll Back To top Button Code Please Help me

Reply
DDDproduktionen
12/2/2013 11:00:28 pm

Can you tell me the name of your theme?
I will make a tutorial for the scroll to top javascript.

Reply
Gaurav Jain link
14/2/2013 01:44:06 pm

http://gauravjain01.weebly.com/
Modern,Artsy and Lucid i like all this 3 themes
which ever u want to help me PLease help me
and i also want to modify the footer according to my neew

DDDproduktionen
14/2/2013 09:20:19 pm

So your footer code looks like this:

<div id="footer-wrap">
<div class="container">
{footer}

Replace this code by:

<div id="footer-wrap">
<div class="container">
"your name and links"
<div id="footer-wrap" style="visibility:hidden">
{footer}

(Than just change "your name and links")

vivekrajagarwal link
13/2/2013 11:13:39 pm

plz help ot worked for me :(

Reply
DDDproduktionen
14/2/2013 09:10:25 pm

What is your problem?

Reply
ch.umair link
14/2/2013 03:49:22 pm

is this possible to add Flash object instead of menu bar.

Reply
DDDproduktionen
14/2/2013 09:09:14 pm

Perhaps, but it will be hard to achieve this.

Reply
Elijah Cruz Piano link
18/2/2013 07:50:41 am

Hi I want to know how to make a box where it looks like a text box on websites (like the one's like the one you type in for this) but to where I can put in a HTML code for one of my videos of piano. Please Let Me Know Here: http://classgamingfree.weebly.com/let-me-know.html Please Let Me Know thx :D

Reply
DDDproduktionen
18/2/2013 10:03:06 pm

Thats the Contact form element. You can find it under "Elements" > "More"

Reply
Joe
22/2/2013 07:23:29 am

Thank you DDDproduktionen. Very informative, easy to follow and very well explained... Thanks a million joe

Reply
Nathan link
26/2/2013 05:42:53 pm

How about the footer on the mobile site? Is it possible to get rid of that also???

Reply
DDDproduktionen
27/2/2013 04:04:41 am

No. You can't.

Reply
M evans link
28/2/2013 03:38:52 am

Hi!
I used your tutorial a while back to remove the weebly footer, but since this afternoon, it has reappeared (if you look bottom right of my web page. I haven't changed anything at all, but I notice all my stuff at the footer (which your tutorial taught me) is no longer in the right colours and its all moved to the left! i guess weebly did this to fit their logo back in?
Anyway, if it is weebly that have reinstated their logo, do you have a solution to remove it again? I have left all the coding as you taught, so it should be easy to follow your instructions again!
Thanks if you can help. Much appreciated,
Mary

Reply
DDDproduktionen
28/2/2013 06:34:16 pm

Your code looks right to me. Did you perhaps reverted the theme? Because then some class names could have changed.

Reply
M evans link
28/2/2013 07:59:24 pm

Hi and thanks for your reply. I'm not exactly sure what you mean but I didn't do anything with the theme. If I paste the code here maybe you will be able to spot where something is missing? It's worth a try!

<div id="footer">{footer}</div>
<div id="footer-content" style="visibility:hidden">{footer}</div>
<div id="footer-wrap">
<div class="site_footer" style="height:30px" align="center"> 2013 Lovefoodies©
<a href="http://www.lovefoodies.com/index.html">Home</a>
<a href="http://www.lovefoodies.com/about-me.html">About</a>
<a href="http://www.lovefoodies.com/contact-us.html">Contact Us</a>
<a href="http://www.lovefoodies.com/links.html">Links</a>
<a href="http://www.lovefoodies.com/terms-of-service.html">Terms of Service</a></div>

<div id="page">
<div<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-nc-sa/3.0/88x31.png" /></a><br /><span xmlns:dct="http://purl.org/dc/terms/" property="dct:title">Lovefoodies</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://www.lovefoodies.com/" property="cc:attributionName" rel="cc:attributionURL">M Evans</a> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/deed.en_US">Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License</a>.<br />Based on a work at <a xmlns:dct="http://purl.org/dc/terms/" href="http://www.lovefoodies.com/" rel="dct:source">http://www.lovefoodies.com/</a>.</div>
<div<a href="default.asp">
<img src="http://disclosurepolicy.org/images/badge-small.jpg" width="60" height="28"></a></p></div>
</div>
<div id="footer"style="visibility:hidden">{footer}</div>

When you look at the actual web page, everything is a mess now and I don't know how to make it look tidy, like to space it properly, so if it's possible you could suggest how to do it and see if you can spot why the weebly thing has appeared again I would be eternally grateful!!! When I look at all the code it overwhelms me, but your instructiona have always been very easy to follow :)
thanks once again,
Mary

DDDproduktionen
1/3/2013 12:45:38 am

I don't know how it looked like before, but this should fix it.

Just delete the old code and paste this:

<div id="footer-wrap">
<div id="footer">
<div align="center"> 2013 Lovefoodies©
<a href="http://www.lovefoodies.com/index.html">Home</a>
<a href="http://www.lovefoodies.com/about-me.html">About</a>
<a href="http://www.lovefoodies.com/contact-us.html">Contact Us</a>
<a href="http://www.lovefoodies.com/links.html">Links</a>
<a href="http://www.lovefoodies.com/terms-of-service.html">Terms of Service</a></div>
<div id="page">
<div<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/deed.en_US"><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by-nc-sa/3.0/88x31.png" /></a><br /><span xmlns:dct="http://purl.org/dc/terms/" property="dct:title">Lovefoodies</span> by <a xmlns:cc="http://creativecommons.org/ns#" href="http://www.lovefoodies.com/" property="cc:attributionName" rel="cc:attributionURL">M Evans</a> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/3.0/deed.en_US">Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License</a>.<br />Based on a work at <a xmlns:dct="http://purl.org/dc/terms/" href="http://www.lovefoodies.com/" rel="dct:source">http://www.lovefoodies.com/</a>.</div>
<div<a href="default.asp">
<img src="http://disclosurepolicy.org/images/badge-small.jpg" width="60" height="28"></a></p></div>
</div>
<div id="footer"style="visibility:hidden">{footer}</div>
</div>
</body>

M evans link
1/3/2013 02:20:28 am

Gosh!!!! Thanks very much for your help. It's all back to normal now and the footer is nice and tidy :)
I wondered if you know how to put a space or divider line inbetween the About, index,contact us etc as they are all squashed together and I wanted it to look like yours!
Thanks once again for your efficiency and great help. Much appreciated!

Reply
DDDproduktionen
1/3/2013 10:03:38 pm

You can add some padding in the CSS. Or you can a divider line in the HTML.

e.g.: <a href="http://...">Home</a> |
<a href="http://...">About</a> |

Reply
M evans link
2/3/2013 12:05:41 am

All done! Such a simple thing and it has made all the difference. Looks much better now with the dividers. Thanks heaps and heaps :)

Moose
6/3/2013 07:45:51 am

Arrrrrgh! They changed the code and now i don't know where to put the visibilty:hidden code. HELP!!!! (see below)
====
/* Footer
--------------------------------------------------------------------------------*/

#footer {
background: #151515;
padding: 44px;
font-size: 12px;
color: #9f9f9f;
text-align: right;
font-family: Arial, Helvetica, sans-serif;
}

#footer h2 {font-size:1.5em; color:#ccc; border-bottom:1px solid #666; margin-bottom:2px;}
#footer p {
color: #9f9f9f;
}

#footer .paragraph ul{
margin:0px !important;
padding:0px !important;
}

#footer .paragraph li{
list-style:none !important;
margin:0px !important;
}

#footer span {
vertical-align: middle;
}

.wsite-footer { /* make sure enough space between element footer and attribution */
margin-bottom: 15px;
}
#footer blockquote {
border-left:4px solid #333;
color:#666;
}

Reply
DDDproduktionen
7/3/2013 02:31:00 am

You are working in the CSS file. You need one of the four HTML files.

Reply
Moose
8/3/2013 03:51:08 am

I used to be able to access the HTML files (along with the CSS) in design mode but now all I seem to be able to access is just the CSS. Where do I find the HTML now???

DDDproduktionen
8/3/2013 11:58:21 pm

Go to Design (on top of the page) > Edit HTML/CSS (upper right corner) > You will see CSS, Page Layouts and Files > Under Page Layouts you will find 4 HTML files > The best thing you can do is to change the code in all 4 headings.

Moose
10/3/2013 09:10:15 am

Thanks for such fast replies. I tried changing the code in the HTML files as described in your video and initial post at the top but can't get to to hide the footer. In one instance it moved it to the left but it was still visible. What am I missing? Here's what the code looks like without modification...
===
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body class="wsite-theme-light tall-header-page">
<div id="container">
<div id="top-section">
<div id="inner-section">
<div id="header-container">
<div id="header-top">
<table id="header">
<tr>
<td id="logo">{logo}</td>
<td id="header-right">
<table>
<tr>
<td class="phone-number">{phone:text}</td>
<td class="social">{social}</td>
<td class="search">{search}</td>
</tr>
</table>
</td>
</tr>
</table>
<div id="topnav">
{menu}
<div style="clear:both"></div>
</div>
</div>
</div>
<div id="main">
<div id="banner">
<div class="wsite-header"></div>
</div>
<div id="content">{content}</div>
</div>
<div id="footer">{footer}</div>
</div>
</div>
</div>
</body>
</html>
==
Again, thanks for your help :)

DDDproduktionen
12/3/2013 12:31:57 am

Change the footer code into this:

<div id="footer">
<div id="footer"style="visibility:hidden">{footer}</div>
</div>

Madan
6/3/2013 11:17:16 am

how to change this

<div id="footer-wrap">
<div id="footer">
{footer}
<div class="clear"></div>
</div>
</div>

Reply
DDDproduktionen
7/3/2013 04:18:52 am

<div id="footer-wrap">
<div id="footer" style="visibility:hidden">
{footer}
<div class="clear"></div>
</div>
</div>

Reply
DDDproduktionen
7/3/2013 10:44:45 pm

Hi Mnta,

Your new footer code:

<div id="footer-wrap">
<div id="page">
<div id="footer">
© 2013 Monta Neinberga. All rights reserved. |
<div id="footer" style="visibility:hidden">{footer}</div>
</div>
</div>
</div>

To align it left, go to your CSS code, search for
#footer and change the text-align to left.

Reply
Mnta
8/3/2013 12:23:54 am

Thanks a lot for your quick reply. It's amazing and it works like a chime. You are my hero!

Reply
Bridget
19/3/2013 01:02:16 pm

Hi, I think I found the right spot in the code to add the visibility:hidden stuff, but since I'm using a free version, it asks me to Save, and then I lose all the other formatting from my template. Any suggestions on what I need to do? Do I have to Save it? I don't have a Publish button when I'm in the CSS/HTML, just Cancel or Save. I am new to Weebly as of today, so def. still learning.Thanks!!!

Reply
DDDproduktionen
20/3/2013 02:37:40 am

Yes, you have to save it.
Did you lose the formatting from the template or the footer.
If it is from the template, you probably forgot to end a div.

Reply
DDDproduktionen
21/3/2013 11:43:45 pm

@Vivek Malhotra

This is how you change your footer code:

<div id="footer-wrap">
<div id="main-footer-wrap">
<div class="container">
[YOUR TEXT]
<div class="container" style="visibility:hidden">
{footer}
</div><!-- end container -->
</div>
</div><!-- end footer-wrap -->

Reply
saif link
23/3/2013 09:16:36 pm

hello...
do to make a back top to top button like yours which scrolls with the screen...please give me step by step making of it...i am new here

Reply
DDDproduktionen
24/3/2013 03:36:51 am

You can follow this tutorial: http://dddproduktionen.weebly.com/1/post/2013/02/scrollt-to-top-function-for-weebly.html

Reply
ishan link
25/3/2013 04:07:19 pm

can u please tell me how to use another website link as a page option

Reply
BG
30/3/2013 12:39:08 pm

Hi! I just wanted to thank you for your advice...this page really helped!

I was wondering if you knew how to add a custom footer with a different background color. Does this need to be done in the CSS?

I currently have a white background and would love a grey footer with columns of links.

Thanks!

Reply
DDDproduktionen
31/3/2013 11:24:33 pm

You can change the colors in the CSS. But you have to make the footer in the HTML.

Reply
Jeroen link
30/3/2013 10:59:40 pm

Hi,
First of all thank you for your great efforts to help us all out, it's much appriciated!
I am working on a webiste and I want an adres footer instead of the weebly footer. I tried your code and it removed the weebly footer. In weebly I can now see my adres line, but it is not centered. Can you help me to solve this problem?
The second problem is that when I publish the site I don't see the adres at all. What went wrong?

The code is:
<div id="footer-wrap">
<div id="page">
<div id="footer">
<div "align="center"> STUDIO DIEP Swammerdamstraat 33b 091 RR Amsterdam info@studiodiep.nl 06-16580464
<div id="footer-content" style="visibility:hidden">{footer}</div>
</div>

Reply
DDDproduktionen
31/3/2013 11:44:08 pm

I think it's better to use this code:

<div id="footer-wrap">
<div id="page">
<div id="footer">
STUDIO DIEP Swammerdamstraat 33b 091 RR Amsterdam info@studiodiep.nl 06-16580464</div>
<div id="footer" style="visibility:hidden">{footer}</div>
</div>
</div>

Center the footer in the CSS. (text-align: center)

Reply
Juve
1/4/2013 06:03:06 pm

help me with this sir

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body class=' landing-page wsite-theme-dark'>
<div id="container">
<table id="header">
<tr>
<td id="logo">{logo}</td>
<td id="header-right">
<table>
<tr>
<td class="phone-number">{phone:text}</td>
<td class="social">{social}</td>
<td class="search">{search}</td>
</tr>
</table>
</td>
</tr>
</table>
<div id="main">
<div id="banner">
<div id="banner-left">
<div class="wsite-header"></div>
<em id="tl"></em>
</div>
<div id="bannerright" class="landing-banner-outer">
<div class="landing-banner-mid">
<div class="landing-banner-inner">
<h2>{headline:text global="false"}</h2>
<p>{headline-paragraph:text global="false"}</p>
{action:button global="false"}
</div><!-- end banner inner -->
</div><!-- end banner mid -->
</div><!-- end banner-right -->
<div class="clear"></div>
</div>
<div id="navigation">
{menu}
<div class="clear"></div>
</div>
<div id="content">
{content}
<div class="clear"></div>
</div>
</div>
<div id="footer">
{footer}
<div class="clear"></div>
</div>
</div>
</body>
</html>

Reply
DDDproduktionen
1/4/2013 11:40:15 pm

<div id="footer">
YOUR TEXT
<div id="footer"style="visibility:hidden">{footer}</div>
<div class="clear"></div>
</div>

Reply
Rahul Singh link
5/4/2013 12:19:26 am

Hi Team,

I have just created a website and edited the footer code with the help of css, look how:

#footer-wrap {
background:url(footer-bg.jpg) repeat;
text-align:right;
margin-top:10px;
font-size:15px;
font-weight:normal;
color:#777777;
visibility:hidden;
}

#custom-footer {
float:left;
text-align:right;
width:960px;
margin:0px 0 0px 0;
font-size: 14px;
font-weight: bold;
}

Now I have successfully removed the footer code..... The problem is that I want to add my own custom footer code of :

HOME , ABOUT US, SERVICES, PRODUCTS, CONTACT US and want to write ALL RIGHTS RESERVED WITH CLICKNE

I am getting CSS ___ Main style page

and

Under Page Layout

Add new layout
tall-header.html
short-header.html
no-header.html
landing.html



SO where should I go to add my own custom footer....... my page is looking like this now:


Tall. Header


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>

<body class='tall-header-page wsite-theme-dark'>
<div id="header-wrap">
<div class="container">
<table id="header">
<tr>
<td class="phone-number">{phone:text}</td>
<td id="header-right">
<table>
<tr>
<td class="social">{social}</td>
<td class="search">{search}</td>
</tr>
</table>
</td>
</tr>
</table>
</div><!-- end container -->
</div><!-- end header-wrap -->

<div id="nav-wrap">
<div class="container">
<table>
<tr>
<td id="logo">{logo}</td>
<td>{menu}</td>
</tr>
</table>
</div><!-- end container -->
</div><!-- end nav-wrap -->

<div id="banner-wrap">
<div id="banner-top"></div>
<div class="container">
<div id="banner">

<div class="wsite-header"></div>

<div style="clear:both;"></div>
</div><!-- end banner -->
</div><!-- end container -->
</div><!-- end banner-wrap -->

<div id="main-wrap">
<div class="container">
{content}
</div><!-- end container -->

</div><!-- end main-wrap -->

<div id="main-wrap-bottom">
<div class="container">
<p class="left-image"></p>
<p class="right-image"></p>
</div><!-- end container -->

</div><!-- end main-wrap bottom -->

<div id="footer-wrap">

<div id="footer-wrap-inner"></div>

<div class="container">
{footer}
</div><!-- end container -->

</div><!-- end footer-wrap -->

</body>

</html>

Reply
DDDproduktionen
5/4/2013 01:54:11 am

I think it's better to remove the footer in the HTML code, and not in the CSS.
This would be your code:

<div id="footer-wrap">
<div id="footer-wrap-inner"></div>

<div class="container">
<a href="Your link">HOME</a>
...
All rights reserved ...
<div style="visibility:hidden">
{footer}
</div><!-- end container -->
</div><!-- end footer-wrap -->

Reply
Rahul Singh
5/4/2013 11:45:27 am

Hey DDDproduktionen,

Thank you for your fast assistance... I just visited your website home... Mind blowing how u have done ur footer please guide... I would love to have a footer like you... please guide me and every member here...

Also the the content area.....




Webdesign
How to make/ create your own website.
More

Fun
Play addicting games and watch funny videos. More
SEO
Optimize your website for search engines.
More

About us
Who we are and what we do.
More
Blog
Tips and tricks for your Weebly website.
More

Follow us




Most popular
How to remove the Weebly footer for free.
How to add a favicon to Weebly for free.
How to put background music on Weebly.
How to add a paragraph with background color.





HOW YOU HAVE DONE THIS............ Please guide

Reply
DDDproduktionen
6/4/2013 10:13:41 pm

I can't really expain how I did the footer. Every theme is different and it was trial and error to make it.
For the home page I used the multiple columns element with title and paragraph elements in it. So nothing special.

Reply
mahaveer link
8/4/2013 04:00:13 am

sir i wnt a user profile and login option to my web and want to share images and video dorectly from user

Reply
mahaveer link
15/4/2013 04:24:30 am

i want to add footer text plz help me

Reply
DDDproduktionen
15/4/2013 07:19:31 pm

After you removed the weebly footer, you can add your footer text by adding a new line of text above <div style="visibility:hidden">.

Reply
Unknown link
15/4/2013 05:30:47 am

Sir, on my account it doesn't allow me to edit html. Only the css of my theme, have you got another idea that I may use instead?

Reply
DDDproduktionen
15/4/2013 07:16:36 pm

You can hide the footer in the css, but you can't make one in the css.
You need the html code to make your footer.

Reply
Unknown link
22/4/2013 07:51:30 am

OK, but do you know how to get the html folder, I am familiar with html concept. but on weebly, I have tried looking at the source code, and still am not able to find a way to edit it.

DDDproduktionen
22/4/2013 10:52:19 pm

This will show you how to do it:
http://www.youtube.com/watch?v=_FSyEc_8Pac

Click the html file you are using. (Under Page Layouts).

Unknown link
23/4/2013 07:34:31 am

Ah, thanks! Bye, I just realized those html files. Thanks. Oh, and nice site.

Reply
Unknown link
23/4/2013 08:19:20 am

The footer still shows up and the html data I inputted into "tall-header.html" won't show.

Reply
Unknown link
23/4/2013 08:28:35 am

Code:
<div id="footer-wrap">
<div id="footer-inner-wrap">
<div class="container">
<div>
{footer}
</div><!-- end container -->
</div><!-- end footer-inner-wrap -->
</div><!-- end footer-wrap -->

Reply
DDDproduktionen
23/4/2013 07:24:17 pm

This is the code you have to use:

<div id="footer-wrap">
<div id="footer-inner-wrap">
<div class="container">
[Your new footer text.]
<div style="visibility:hidden">
{footer}
</div>
</div><!-- end container -->
</div><!-- end footer-inner-wrap -->
</div><!-- end footer-wrap -->

I can advise you to change this code in all four headings. (to avoid problems when you change the layout)

DAVID OST link
23/4/2013 11:43:16 pm

thanks so much for all your help.

just in the MOBILE site it always shows up, so if anyone looks at it from a TABLEt etc they will see it, any ideas sir.

Reply
Unknown link
24/4/2013 05:03:04 am

For that you cannot change.

Reply
DDDproduktionen
26/4/2013 12:02:00 am

Yes. You can't hide the mobile footer. Tablets display the full website, only phones will have the mobile footer.

Reply
Terrence
11/7/2013 05:34:16 am

If you're really dead set against the Weebly footer appearing on the mobile version you can disable the optimized mobile view under settings, which will automatically show the full version of your site without the footer on mobile phones, too, if you've removed it.

Reply
Maran
26/4/2013 01:54:46 am

I have problems finding the exact right part of the code that I have to replace. All I can find about the footer in the CSS, is this:


#footer-wrap {
text-align:right;
background:url(nav-bg.jpg);
color:#ddd;
padding:30px 0;
}


#footer-wrap h1, #footer-wrap h2 {color:#fff; font-size:19px;}
#footer-wrap span, #footer-wrap p, #footer-wrap .wsite-form-label {color:#bbb;}
#footer-wrap a {color:#fff !important;}
#footer-wrap a:hover {color:#888 !important;}

#footer-wrap .container .wsite-footer {
margin: 0 10px;
}
#footer-wrap .wsite-form-container {
text-align:left;
margin-top:0 !important;
}

If I delete that all, still 'Create a free website with Weebly' is visible. Can anyone explain how I can get rid of that text? :) There is no <div> used in the code of the theme, only # like above.
I don't have a pro account, just a free one. I hope it is still possible to change the code. Thanks already for every help!

Reply
Maran
26/4/2013 01:59:51 am

Already fixed it! Had to paste visibility:hidden; after the first sentence like this:

#footer-wrap {visibility:hidden;

then pressed space and backspace. It worked :) Happy!

Reply
Asterik Designs link
28/4/2013 06:12:54 am

I'll give a try, thanks. Hey did you tell me how to change the mobile site layout like you are using, for mine it showing me the boring sober layout. Thanks in advance.

Reply
DDDproduktionen
29/4/2013 02:15:38 am

You can change that under Settings > Mobile settings > Enable mobile.

Reply
australia people search link
5/5/2013 03:03:31 pm

Thanks for talking about information. That is a awesome material you launched. I discovered the post very useful as well as interesting. I will come returning to analysis some more.

Reply
welly
7/5/2013 12:20:26 pm

I also dont know how to change the code as below, please help to solve this problem, thank you.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body class="wsite-theme-light tall-header-page">
<div id="header-wrap">
<div id="page">
<div id="header-container">
<table id="header">
<tr>
<td id="logo">{logo}</td>
<td id="header-right">
<table>
<tr>
<td class="phone-number">{phone:text}</td>
<td class="social">{social}</td>
</tr>
</table>
<div class="search">{search}</div>
</td>
</tr>
</table>
<div id="topnav">
{menu}
<div style="clear:both"></div>
</div>
</div>
</div>
</div>
<div id="banner-wrap">
<div id="container">
<div id="banner-bot">
<div id="banner">
<div id="banner-mid">
<div id="banner-outer">
<div class="wsite-header"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="main-wrap">
<div id="page">
<div id="main">
<div id="content">{content}</div>
</div>
</div>
</div>
<div id="footer-wrap">
<div id="page">
<div id="footer">{footer}</div>
</div>
</div>
</body>
</html>

Reply
DDDproduktionen
7/5/2013 08:38:18 pm

You can use this code:

<div id="footer-wrap">
<div id="page">
<div id="footer">
<div style="visibility:hidden">
{footer}
</div>
</div>
</div>
</div>

Reply
randhir
15/5/2013 02:25:09 am

thanks

Reply
mm
16/5/2013 12:32:43 pm

How can I decrease the font size on my new footer?

Reply
DDDproductionen
16/5/2013 05:41:59 pm

You can change the font size in the CSS.

Reply
Joseph
19/5/2013 08:50:53 pm

it didnt worked out for me

<div id="footer-wrap">
<div class="container">
"your name and links"
<div style="visibility:hidden">
{footer}
</div><!-- end container -->
</div><!-- end footer-wrap -->

Reply
DDDproduktionen
20/5/2013 10:15:46 pm

Did you put this code in the right heading?
It looks like you just copied my example code, but you have to change it.

Reply
gootchums link
2/6/2013 02:09:14 am

I added one line - <div id="footer">!! It fixed everything....no lengthy explanations.

<div id="footer-wrap">
<div class="container">
<div class="container-inner">
<div class="text">{text}</div>
{FOOTER}
<div id="footer">
<div style="clear:both;">
</div>
</div>
</div>

</div>
</div><!-- end container -->
</div><!-- end footer-wrap -->

Reply
Spencer link
22/6/2013 01:45:55 am

Hey DDDproduktionen,
I did it and it worked,but now I have a problem.
The header area has grown to a super large size.
What should I put the code in:(Tall Header.Html Or Short Header.Html) to fix this problem??

Reply
DDDproduktionen
24/6/2013 10:52:52 pm

You can add the code in all four headings. Maybe you forgot to end a div.

Reply
Spencer
22/11/2013 02:19:24 am

Thank you. I'll try to fix that. :-)

Azizi link
24/6/2013 01:10:01 pm

Didnt work as of 25th June 2013..Help needed here..

Reply
DDDproduktionen
24/6/2013 10:56:26 pm

It's still working.
Just add <div style="visibility:hidden"> above {footer}.

(Note: Do this in all four headings.)

Reply
Gulfarogh
9/7/2013 11:20:09 pm

Thanks It Works

Reply
Spencer
15/8/2013 08:33:47 am

Hi DDDProduktionen,
I need help.
My Theme looks like this:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>


<body class='short-header-page wsite-theme-light'>
<div id="header-wrap">
<div class="container">
<table id="header">
<tr>
<td class="phone-number">{phone:text}</td>
<td class="social">{social}</td>
<td class="search">{search}</td>
</tr>
</table>
</div><!-- end container -->
</div><!-- end header-wrap -->

<div id="logo">
<div class="container">
{logo}
</div>
</div>

<div id="nav-wrap">
<div class="container">
{menu}
</div><!-- end container -->
</div><!-- end nav-wrap -->

<div id="banner-wrap">
<div class="container">
<div id="banner">

<div class="wsite-header"></div>

<div style="clear:both;"></div>
</div><!-- end banner -->
</div><!-- end container -->
</div><!-- end banner-wrap -->

<div id="main-wrap">
<div class="container">
{content}
</div><!-- end container -->
</div><!-- end main-wrap -->

<div id="footer-wrap">
<div class="container">
Building
<div style="visibility:hidden">
{footer}
</div><!-- end container -->
</div><!-- end footer-wrap -->
</body>

</html>



Where do I put the html codes?

Reply
DDDproduktionen
19/8/2013 10:00:02 pm

Your code looks good. With this code you should see the word "Building" instead of the Weebly footer.
If not your probably working in the wrong header.

Reply
Spencer
22/11/2013 02:16:56 am

Thank you. That REALLY helped. :-)

louiswayne link
22/8/2013 04:18:00 am

how do i change the colour of footer?

Reply
DDDproduktionen
23/8/2013 10:15:26 pm

Well in your case, the background of your footer is an image.
So you can either upload a new image with the correct color or you can delete the image and use a background color instead. For example:

#footer-wrap { background: #fff; text-align:right; }

Reply
Mark Lee Gaming link
28/8/2013 01:57:54 am

I typed this, didn't work, Please help!!!

<div id="footer">
<div id="footer-content">
© 2013 “Mark Lee Gaming”
<a href="http://http://markleegaming.weebly.com/contact-me.html">Contact</a> |
<div style="visibility:hidden">
{footer}

Reply
DDDproduktionen
29/8/2013 12:00:20 am

I changed your code a little bit, because you had no end divs.
But even without that it should have worked. The only problem I can see is that you pasted the code in the wrong heading. You can prevent this by adding the code in all four headings (tall-header.html, short-header.html,no-header.html,landing.html)

Your code:

<div id="footer">
© 2013 Mark Lee Gaming |
<a href="http://http://markleegaming.weebly.com/contact-me.html"> Contact</a>
<div style="visibility:hidden">
{footer}</div></div>
<div class="clear"></div>

Reply
jhem link
1/9/2013 03:28:35 am

Hi, can you tell me what's wrong with my codes when I tried to hide the weebly footer? I get this </body>
</html> highlighted after I made this changes. Coz I think there's a missing piece or something like that. Here's my codes,

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript" src="http://s.sharethis.com/loader.js"></script>
</head>
<body class=' landing-page wsite-theme-light'>
<div id="top-bg"></div>
<div id="container">
<div id="header-top">
<div id="pen"></div>
<table id="header">
<tr>
<td id="logo">{logo}</td>
<td id="header-right">
<table>
<tr>
<td class="phone-number">{phone:text}</td>
<td class="social">{social}</td>
</tr>
</table>
<div class="search">{search}</div>
</td>
</tr>
</table>
</div>
<div id="navigation">
{menu}
<div class="clear"></div>
</div>
<div id="main-top">
<div id="main-bg"></div>
<div id="main-bot">
<div id="main">
<div id="banner">
<div id="banner-left">
<div id="frame-wrapper">
<div id="wsite-header-wrapper">
<div class="wsite-header">
<div id="frame"></div>
</div>
</div>
</div>
</div>
<div id="bannerright" class="landing-banner-outer">
<div class="landing-banner-mid">
<div class="landing-banner-inner">
<h2>{headline:text global="false"}</h2>
<p>{headline-paragraph:text global="false"}</p>
{action:button global="false"}
</div><!-- end banner inner -->
</div><!-- end banner mid -->
</div><!-- end banner-right -->
<div class="clear"></div>
</div>
<div id="content">
{content}
<div class="clear"></div>
</div>
</div>
</div>
</div>
<div id="footer">
<div class="site_footer"
style="height:30px"
align="center"> © 2013 RenJhem for Life
<div id="footer-content"
style="visibility:hidden">{footer}</div>
<div class="clear"></div>
</div>
</div>
<script type="text/javascript">
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
var disqus_shortname = 'renjhem'; // required: replace example with your forum shortname

/* * * DON'T EDIT BELOW THIS LINE * * */
(function () {
var s = document.createElement('script'); s.async = true;
s.type = 'text/javascript';
s.src = '//' + disqus_shortname + '.disqus.com/count.js';
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
</script>
</body>
</html><script type="text/javascript">stLight.options({publisher: "843ab701-1ee9-49df-af74-49d6f967eefa", doNotHash: false, doNotCopy: false, hashAddressBar: true});</script>
<script>
var options={ "publisher": "843ab701-1ee9-49df-af74-49d6f967eefa", "position": "right", "ad": { "visible": false, "openDelay": 5, "closeDelay": 0}, "chicklets": { "items": ["facebook", "twitter", "pinterest", "linkedin", "googleplus", "email", "sharethis"]}};
var st_hover_widget = new sharethis.widgets.hoverbuttons(options);
</script>


All goes well before I decided to hide the footer. This is the only codes that I am suspecting for the highlighting in </body>
</html>
Here they are:
<div id="footer">
<div class="site_footer"
style="height:30px"
align="center"> © 2013 RenJhem for Life
<div id="footer-content"
style="visibility:hidden">{footer}</div>

I just can't find whats wrong with it, Please help~~~

Reply
DDDproduktionen
1/9/2013 11:19:54 pm

Hi,

Well you have 3 divs in the footer code, but you only closed 2. So now you only need to close that third div by adding </div>

Your footer code should be:

<div id="footer">
<div class="site_footer"
style="height:30px"
align="center"> © 2013 RenJhem for Life
<div id="footer-content"
style="visibility:hidden">{footer}</div>
<div class="clear"></div>
</div>
</div>
</div>

Reply
jhem link
4/9/2013 10:16:40 pm

Hi DDDproduktionen,

A lot of thanks for your help! It works!
Will work on writing a post about your site soon, hope many others find you as well, your site was loaded of so many helpful infos.

God bless! ^_^

jhem link
5/9/2013 01:53:38 am

Hi, DDDproduktionen,

I am getting confused why the name I put in the footer is not appearing in my homepage but it is ok with other pages, its visible.
I even tried to create another page for home but when I deleted it and set the second one as my homepage, once again it turns invisible, it is happening only in homepage. How is that?

DDDproduktionen
5/9/2013 11:40:48 pm

I can see your footer on all pages.

jhem
6/9/2013 07:16:22 am

hi,

yes,it is visible now, cos i just leave the other one main page as home and hide it cos if i remove it, the footer will go invisible again. anyway, thanks a lot!

God bless

pamela link
9/9/2013 09:05:02 am

Hi

Question im using a weebly template and im not a pro. can I still change the back ground image on the header and footer? if so how?

thanks in advance.

Reply
DDDproduktionen
10/9/2013 03:19:22 am

Yes you can. You can change the background images in the css.

Reply
Al
23/9/2013 10:19:33 pm

Hi, how do I get rid of the footer? Thanks:

page #footer {
width: 524px;
}

/* Footer
--------------------------------------------------------------------------------*/

#footer-wrap {
border-top: 1px solid #dedede;
background: #fafafa;
min-width: 920px;
}

#footer {
padding: 40px 0 45px;
font-size: 12px;
color: #666;
font-family: Arial, sans-serif;
text-align: right;
}

#footer p {
color: #666;
}

#footer h2 {
font-size: 16px;
margin: 0 0 2px;
padding: .3em 0;
line-height: 1.5;
color: #414141;
font-family: "Actor", "Myriad Pro", Arial, Helvetica, sans-serif;
border-bottom:1px solid #ddd;
}

#footer span {
vertical-align: middle;
}

.wsite-footer { /* make sure enough space between element footer and attribution */
margin-bottom: 15px;
}

Reply
SHAIZOR link
4/10/2013 02:45:26 am

i want footer code © Dora Nobita in center and logo doranobita logo

Reply
DDDproduktionen
4/10/2013 10:17:35 pm

You can center your footer in the css.
(Text-align: center;)

Reply
shaizor link
5/10/2013 08:32:29 pm

how to put logo in footer please help!!

Reply
DDDproduktionen
6/10/2013 01:48:29 am

These are the steps:

1) Go to design (on top of the page) > Edit HTML/CSS (bottom left) > upload your logo under files (left side).

Get the link: http://doranobita.weebly.com/files/theme/NAME.png
(You just have to change the name and the file extension if necessary)

2) Go to the html > add the following code after your footer text

<img src="http://doranobita.weebly.com/files/theme/NAME.png">

Reply
shaizor
7/10/2013 11:27:41 pm

Thank You Very Much

SHAIZOR
7/10/2013 11:45:21 pm

How to on Search Box on weebly for free Help !!

Reply
DDDproduktionen
8/10/2013 04:07:44 am

You can use google custom search.

Reply
http://health.proconview.com/kyle-leon-scam/ link
9/10/2013 03:30:52 pm

Exciting blog post! I really enjoyed reading this content. You are a brilliant writer. I like your way of presentation. Keep it up.

Reply
shaizor
10/10/2013 01:08:12 am

Thank You Very Much dddproduktionen

Reply
shaizor
10/10/2013 01:14:47 am

how to make sliding text in weebly.com from left to right

Reply
DDDproduktionen
10/10/2013 04:52:18 am

With the html <marquee> tag.

<marquee behavior="scroll" direction="right">YOUR TEXT</marquee>

Reply
shaizor
10/10/2013 12:28:43 pm

how to increase sliding text size and how to change color black to red

Reply
DDDproduktionen
11/10/2013 05:12:22 am

This is the html code with css (This will make your text bigger and change it to red):

<marquee class="marquee" behavior="scroll" direction="right">YOUR TEXT</marquee>

Add this code in the css:

.marquee{
color:red;
font-size:18px;
}

Reply
Davide
11/10/2013 08:50:46 am

When I try to hiddent the weebly logo and put a name, the grey space below increase and the text appear all on the left side, not in the place of the hidden weebly logo where I would like it to be.
I have this in my headers and landing:

</div>
<div id="footer-wrap">
<div id="page">
<div id="footer">{footer}</div>
</div>
</div>
</body>
</html>

Reply
DDDproduktionen
11/10/2013 11:18:59 pm

This should work:

<div id="footer-wrap">
<div id="page">
<div id="footer">
This is the new footer.
<div style="visibility:hidden">
{footer}
</div>
</div>
</div>
</div>

Reply
Davide link
15/10/2013 08:00:12 pm

Thank you very much

shaizor
12/10/2013 07:27:10 pm

can you give me you'r footer code please. i want footer like you.

Reply
shaizor
15/10/2013 07:40:31 pm

can you give me you'r footer code please. i want footer like you.

Reply
Bhai
19/10/2013 04:23:45 pm

Hello can you give me you'r footer code please. i want footer like you. please !!! Help!!

Reply
FGR link
26/10/2013 09:58:32 pm

Hi i am FGR about the footer how did you add DDDPO INFO FOLLOW US POPULAR POSTS

Reply
FGR link
26/10/2013 10:01:17 pm

Never Mind i am acting dumb

Reply
click the next page link
1/11/2013 03:07:20 pm

This is a great discovery. It will help us write history.

Reply
marsel
14/11/2013 06:44:03 pm

Thanks bro , you are the best

Reply
media web desgning link
17/11/2013 05:57:15 pm

not worked for me. that was for old . now they have changed .

Reply
Elliot Davidson link
2/1/2014 06:49:08 am

Could I get kicked off Weebly for this?

Reply
DDDproduktionen
3/1/2014 12:13:14 am

I don't think so.

Reply
Mohamed Haribullah link
3/1/2014 11:00:58 pm

Hi DDDproduktionen.. Thanks for your help...
I found that we can hide mobile site footer.. by adding this code to footer setting from SEO setting

Code:
<style>

.wsite-footer-vertical

{

display: none;

visibility: hidden;

}

.wsite-app-callout

{

display: none;

visibility: hidden;

}

</style>

Reply
Madelon link
2/2/2014 10:56:19 pm

I tried this, but it doesn't work. Well not for me anyhow. Do you, or does anybody have a solucion to remove the mobile footer of Weebly?

Reply
DDDproduktionen
3/2/2014 01:13:00 am

You can add the code in the css.

.wsite-footer-vertical{
display: none;
visibility: hidden;
}

.wsite-app-callout{
display: none;
visibility: hidden;
}

Spencer link
6/1/2014 02:35:16 am

Hi DDDproduktionen,

I'm helping a friend edit their site and why I tried to remove the footer, I didn't know how to edit the following code(BTW,this is the end part of the code(the Short Header)) :

<div id="content">{content}</div>
<div id="footer">{footer}</div>
</div>
</div>
</body>
</html>

Not sure what to do.What do I do?? My friend has the theme that has the big sunflower as the cover photo.

Thank for the help!!!

Reply
DDDproduktionen
16/1/2014 10:49:47 pm

<div id="footer">
<div style="visibility:hidden">
footer}</div></div></div></div>

Reply
SHAIZOR YAR KHAN link
9/1/2014 04:50:05 pm

i want increase the size of footer and how place the footer to left side please Help

Reply
DDDproduktionen
16/1/2014 10:43:59 pm

You can change that in the css. (font-size & text-align).

Reply
Elliot Davidson link
11/1/2014 05:21:59 am

How do I position the text in the footer so that it isn't just all to the left? I want it to be like your footer. I tried to use the <column> tag but that put scroll bars next to the columns.

Reply
DDDproduktionen
16/1/2014 10:56:46 pm

I use a class that specifies the width of a colum and some list styles.

Reply
Elliot Davidson link
17/1/2014 09:12:28 am

How would I do that?

DDDproduktionen
17/1/2014 09:39:42 pm

I've tried to make a post about it, but I can't explain it properly (because you need to understand css and html).

Basically it looks like this: http://stackoverflow.com/questions/18797724/4-column-css-footer-that-is-responsive

You still have to adapt the code to your needs.

Elliot Davidson link
26/1/2014 09:41:38 am

Dude, thank you so much! It worked so well. Thank you, thank you, thank you!

Patricia link
20/1/2014 04:50:33 pm

Hi all,
I've been reading all the posts up there, you guys are pretty helpful. well I've problem in my weebly's "edit htm/css" editor. First of all when i click on it all I get is a blank black area with no coding, and there are options on the left side which are like this
CSS
main-style.css

Page Layouts
Add new layout

Files
Add new file(s)

Thats all I get, there's no index.html or any other option.
And when I click "add new layout" a new window opens which give me 5 options
1.Standard Page (tall header image)
2.Standard Page (short header image)
3.Standard Page (no header image)
4.Landing Page
5.Splash Page

When I click either of these options and click continue and then I choose the page layout then when I hit the save button below, then nothing happens.

Well I explained it all, that's situation here.

Now please you guys specially DDDproduktionen help me to remove the weebly ad from my free weebly site. PLease advice me what to do and be in touch after in case I reply you back.

I'll be so so thankful to you :)

Reply
DDDproduktionen
21/1/2014 10:44:59 pm

Strange. I haven't seen it before. It could be a temporary problem due to an update. Does this happen with every theme?

Reply
Madelon link
3/2/2014 02:28:27 am

Hello DDDProduktionen,

Thank you for your reply. I added the code in the CSS, but it doesn't work. I also have a flexible footer in place, so perhaps that has something to do with it?? Or I didn't put the code in the right place. Perhaps you can have a look at it. Thank you very much!!


#flexifooter{
margin:0pt auto;
width: 966px;
height: 66px;
color: #888800;
font-size: 15px;
background: url(footer2.png)repeat-x center;
text-align: center;
padding: 28px 0px 20px 0px;
}

.wsite-footer-vertical{
display: none;
visibility: hidden;
}

.wsite-app-callout{
display: none;
visibility: hidden;
}


#footer {}

#footer-wrap .wsite-form-container {
text-align:left;
margin-top:0 !important;
}

#footer-wrap .content-top {
visibility: hidden;
background: url(content-bg-top.png) no-repeat center top;
width: 976px;
margin:0 auto;
padding-top:15px;
}
#footer-wrap .content-repeat {
background: url(content-bg.png) repeat-y center top;
width: 976px;
padding-top:20px;
padding-bottom:15px;
}

#footer-wrap h2 {font-size:19px;}

Reply
DDDproduktionen
3/2/2014 11:31:55 pm

It could be because of you flexifooter. Anyway, I tried it again and this one seems to work. You will have to add this code in the footer code under SEO.

<style type="text/css">

.wsite-footer-vertical

{

display: none;

visibility: hidden;

}

.wsite-app-callout

{

display: none;

visibility: hidden;

}

</style>

I hope this works.

Reply
SC link
5/2/2014 03:08:33 am

Dude, thanks!

Reply
Skrapan
24/2/2014 01:46:21 am

Hey, I'm having a hard time getting rid of my footer, I'm pretty sure it is a newer theme. Tried both of your codes and also tried to add the invisivilty line. Nothing seems to work for me.

This is the footer code I have on my theme, could you please edit it in the correct way?

<div id="footer-wrap">
<div id="footer-inner-wrap">
<div class="container">
{footer}
</div><!-- end container -->
</div><!-- end footer-inner-wrap -->
</div><!-- end footer-wrap -->

Reply
DDDproduktionen
27/2/2014 12:43:20 am

<div id="footer-wrap">
<div id="footer-inner-wrap">
<div class="container">
<div style="visibility:hidden">
{footer}
</div><!-- end container -->
</div><!-- end footer-inner-wrap -->
</div><!-- end footer-wrap -->

Reply
Jap14
25/2/2014 11:14:43 pm

Thanks dddproduktionen,
I am very thankful to you............ :D

Reply
Jap14
4/3/2014 11:39:23 pm

Hi, plz tell me how to add footer like in your site..........

Reply
Elliot Davidson link
5/3/2014 03:55:08 am

He gave me this link and I used it and it worked perfectly:

http://stackoverflow.com/questions/18797724/4-column-css-footer-that-is-responsive

Use the original HTML that the guy who asked the question used and use the CSS from the second response. That one worked the best for me.

Reply
Jap14
5/3/2014 11:48:35 am

Thanks Elliot Davidson

Elliot Davidson link
6/3/2014 04:59:27 am

Did it work?

Eva
18/3/2014 01:51:15 am

I used the code for the new Weebly themes you give above to change the footer. Next thing I know, all my content is missing, leaveing behind just the header and a footer that is triple its size. I reverted it back to the original but to no avail. Having contacted Weebly, they said there's no way to get the original content back. Any ideas on how - and why - this happened? The only CSS I touched was the footer code. Might they have a new sort of sensor or something to pick this kind of 'hacking' up?
Signed,
Someone who might just watch too many conspiracy theory-movies :)

Reply
DDDproduktionen
19/3/2014 01:51:00 am

Hi, first of all I don't think that Weebly has a sensor for this trick. Secondly, I've never seen someone losing all his/her content. If you accidentally make a mistake by selecting too many code for example it could mess up your footer, but you can fix that.

Maybe try to look up a cached version of your website, so you can restore some things. (e.g. http://www.cachedpages.com/).

It's strange. Working in the code should only have an effect on the look of your website and not on its content.

Reply
Eva link
22/3/2014 04:29:44 pm

Thanks for your reply. An update: As soon as I changed my theme, all my content returned. Very weird indeed.

vanessa link
18/5/2014 10:13:54 pm

Is it possible to add logos in the footer? I want the same 3 logos to appear at the bottom of all the pages of my website. Thanks

Reply
DDDproduktionen
19/5/2014 07:15:44 pm

Yes you can.

These are the steps to do this:

1) Go to design (on top of the page) > Edit HTML/CSS (bottom left) > upload your logos under files (left side).

2) Open one the html file you are using (under Page layouts)

3) Paste the following code in the footer (where you would place your text.):

<img src="http://YOURDOMAIN/files/theme/IMAGE" id="footer-logo"></a>

After that change your domain name and adapt the name of the image.

(Example of my code:

<img src="http://dddproduktionen.weebly.com/files/theme/5.png" id="footer-logo"></a>)

4) Go to design (on top of the page) > Edit HTML/CSS (bottom left) > Open main-style.css (left side).

5) Paste the following code somewhere in this file:

img#footer-logo{
width: 100px;
}

6) You can change the width of the logos or add some padding in the css.

Reply
Connor link
1/6/2014 06:14:19 am

Although i had got rid of it on my home page, it still pops up on the others?

Reply
DDDproduktionen
1/6/2014 10:15:45 pm

That's probably because you use another page type for the other pages.The best thing you can do is change the footer code for all the different page types.

Reply
Marc link
3/6/2014 09:45:24 am

I would like to eliminate the footer as well.
I'm under Design Page, click on EDIT HTML/CSS

Here is what I have starting on line 493

/* Footer
--------------------------------------------------------------------------------*/
#main-footer-wrap {
background: url(footer-paper-bg-brown-red.jpg) repeat-x center top;
width:100%;
}
#footer-wrap {
text-align:right;
background: url(footer-bg-brown-red.jpg) repeat bottom left;
}
#footer-wrap .container {
padding-top: 46px;
padding-bottom: 30px;
color: #ad9c96;
}

#footer-wrap .container h2 {
background: url(footer-divider-brown-red.gif) repeat-x bottom left;
padding-bottom: 15px;
margin-bottom:5px;
margin-top: 10px;
font-size:18px;
color: #ad9c96;
}

#footer-wrap a{
color: #ffffff;
}

#footer-wrap a:hover{
color: #ad9c96;
}


#footer-wrap .wsite-form-container {
text-align:left;
}

#footer-wrap .wsite-form-input, #footer-wrap .wsite-search-element-input {
font-family:Arial, Helvetica, sans-serif;
font-size: 12px;
color: #ad9c96;
background:none;
background-color: rgba(0, 0, 0, .2);
border: none;
padding: 7px 5px !important;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius:6px ;
-webkit-box-shadow: inset 6px 6px 6px 0px rgba(0, 0, 0, .1);
box-shadow: inset 6px 6px 6px 0px rgba(0, 0, 0, .1);
}

#footer-wrap .wsite-search-element-submit {
background: url(search-dark.png) left;
}

thanks,
Marc

Reply
DDDproduktionen
4/6/2014 12:21:18 am

That's the css file, you don't need that one. You have to open one of the four html files (under Page layouts)(e.g. tall-header.html). Pick the layout you use.

Reply
Marc link
15/6/2014 11:55:26 am

Thank you very much!!!

André link
2/7/2014 01:51:56 am

Please help me:

I want my footer logo left, but now it´s center... How can i do?
-----------
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
</head>
<body class=' tall-header-page wsite-theme-light'>
<div id="container">
<div class="wsite-header"></div>
<div id="main-wrap">
<div id="avmenu">{menu}</div>
<div id="main">
<div id="banner">
</div>
<div id="content">{content}</div>
<br>Mitglied im:</br>
<img src="http://www.weebly.com/uploads/1/5/1/3/15138732/custom_themes/238831980664264516/files/Kopie von BPT%20LOGO1.jpg?1404233808755"id="footer-logo">
<div id="footer"style="visibility:hidden">{footer}</div>
</div>
<div style="clear:both;"></div>
</div>
</div>
<div style='display:none'>{title}</div>
</body>
</html>
--------------------------------------------
in CSS:
--------------------------
img#footer-logo{
clear: left;
width: 200px;
}

Reply
Mariano Poli
8/8/2014 08:55:33 am

Do you know how to remove it also from the mobile site ?

Reply
DDDproduktionen
9/8/2014 01:04:14 am

You can hide it by adding this code in the css:

.wsite-footer-vertical{ display: none;}
.wsite-app-callout{ display: none;}

Reply
Franzi
1/9/2014 10:49:29 pm

How can I add social icons to the footer? How can I rightaligned the icons and how can I leftaligned the text (All rights reserved) ?

Reply
DDDproduktionen
3/9/2014 02:15:54 am

If you want to use the icons provided by weebly, you can use this code:

<span><a class='first-child wsite-social-item wsite-social-facebook' href='http://facebook.com' target='_blank'></a>
<a class='wsite-social-item wsite-social-twitter' href='http://twitter.com' target='_blank'></a>
<a class='wsite-social-item wsite-social-plus' href='http://plus.google.com' target='_blank'></a>
<a class='last-child wsite-social-item wsite-social-youtube' href='http://youtube.com' target='_blank'></a></span>

You can change the alignment in the css. (Look for #footer or #footer-wrap)

Reply
Marc
1/9/2014 11:22:53 pm

great question.

Reply
Toko Lingerie link
7/9/2014 04:34:18 pm

Well, thank you for sharing this simple trick.

Reply
Mamun Billah link
22/9/2014 05:48:07 pm

Thank You So Much.. It's Working So Good..

Reply
Rak Ish link
25/9/2014 11:55:21 am

How come my code is:
<div id="footer-wrap">
<div id="footer-inner-wrap">
<div class="container">
<div style="visibility:hidden">
{footer}
</div><!-- end container -->
</div><!-- end footer-inner-wrap -->
</div><!-- end footer-wrap -->

Reply
Rak Ish
25/9/2014 11:56:20 am

It doesnt matter. It works!

Reply
Yiluo Li
21/10/2014 07:36:44 pm

Thank you soooo much!!!! I had my fixed footer as reference bar but I couldn't get rid of the original one. As I deleted it, it popped up automatically so I was so confused.

<div style="visibility:hiden">{footer}</div>
How easy this is that I didn't know...

Reply
help
13/11/2014 05:46:46 am

you might have already answered but how can i insert an image

Reply
DDDproduktionen
15/11/2014 12:02:27 am

These are the steps:

1) Go to design (on top of the page) > Edit HTML/CSS (bottom left) > upload your logo under files (left side).

Get the link: http://NAME.weebly.com/files/theme/NAME.png
(You just have to change the name of your website and the name of your image and the file extension if necessary)

2) Go to the html > add the following code after your footer text

<img src="http://NAME.weebly.com/files/theme/NAME.png">

Reply
Cooper link
25/11/2014 09:58:02 am

Hi, I have deleted my header on Weebly, can you help me get it back?

Reply
DDDproduktionen
26/11/2014 09:41:45 pm

How did you delete it? Did you delete the html code?

Reply
Elian link
3/1/2015 09:17:36 pm

Hay!
This doesn't work on my site, why doesn't it? I've tried both options; but the both doesn't work...

Reply
Steve link
30/1/2015 04:29:18 am

You are wonderful sharing your experience. Please help.

Mine does not work either. I tried inserting the code just as instructed but the preview did not change. I tried saving it into a new theme and publish, yet the footer remains.
Has Weebly blocked this changed?

Reply
Steve link
30/1/2015 04:56:55 am

My apologies..... I tried again and it worked.
As usual my typing.
Thank you so much .
:)

Reply
Dylan link
11/2/2015 09:24:24 pm

how :( look at mine

Dylan link
11/2/2015 09:22:45 pm

I cannot get mine to change
<div id="footer-wrap">
<div class="container">
© 2015 Barratt Technology Services
<a href="http://www.btechservices.com.au/computer-repairs-melbourne.html">Computer Repairs Melbourne</a> |
<a href="http://www.btechservices.com.au/laptop-repairs-melbourne.html">Laptop Repairs Melbourne</a> |
<a href="http://www.btechservices.com.au/pc-repairs-melbourne.html">Mobile Computer Repairs</a> </div>
<div style="visibility:hidden">
{footer}
</div><!-- end container -->
</div><!-- end footer-wrap -->

But does not show on the website

Reply
DDDproduktionen
11/2/2015 10:20:40 pm

Your code looks fine, so it should work. But I see you have another working footer now.

Reply
jay link
18/3/2015 12:49:32 pm

this works thank you very much!

Reply
Gloria link
13/4/2015 07:03:50 pm

Hi,

Thank you so much for this resource. My site uses the "open" theme. As a starter subscriber, I've been able to remove all text in the default footer, but cannot remove the horizontal divider bar between the main body and footer zone. I'd be very grateful if you could help!

Reply
DDDproduktionen
17/4/2015 11:50:08 pm

You can change that in the css. Open the main_style.css (You can find that under Design > Change html/css > Assets > main_style.css)

Now look for this code in the css:

#main-wrap .container {
min-height:400px;
border-bottom: 4px solid rgba(255,255,255,0.2);
padding: 20px 0 0 0;
}

Remove the following line:

border-bottom: 4px solid rgba(255,255,255,0.2);

If you do that, the bar will be gone.

Reply
Gloria
29/4/2015 06:11:14 pm

Thank you so much for that, your instructions worked perfectly.

Kevin
14/5/2015 03:52:30 am

If I use this code to remove the Weebly footer, will Weebly disable my site for not subscribing to a paid subscription?

Reply
DDDproduktionen
14/5/2015 11:17:42 pm

I don't think so.

Reply
Kevin link
15/5/2015 12:20:31 am

Thank you. I added the code and it removed the footer. One other question, how to change the Weebly footer height? I find it a little too large and want to shorten the height a bit. I'm not using the footer for much of anything, other than copyright and StatCounter. Just want to be able to shorten the height so it doesn't appear too large.

Thank you.

DDDproduktionen
15/5/2015 01:44:31 am

You can change that in the css. Look for "#footer-wrap", and change the height or remove the padding.

Jay
15/5/2015 10:58:50 pm

Hello,

Although this partially work. Using your code disapears the footer. Any advice on making it appear.

I was thinking:

#footer-wrap {
border-top:1px solid #bababa;
text-align:right;
background:#cfcfcf;
padding:20px 0;
}
#footer-wrap h2 {
background:Copyright 2015, Whiz-IT. All rights reserved;
font-size:18px;
line-height:30px;
font-family: 'Open Sans', sans-serif;
color:#303030;
}

#footer-wrap .paragraph{
padding:0px !important;
}

#footer-wrap .paragraph{
list-style:none !important;
padding:0px 0px 0px 10px !important;
line-height:24px;
margin-bottom:10px !important;
background: url(footer_arrow_green.png) no-repeat left 10px;
}

#footer-wrap .wsite-form-container {
text-align:left;
}


Not sure that coding will work - any ideas?

Reply
DDDproduktionen
16/5/2015 12:54:32 am

You don't need to change anything in the css file. You have to make all your changes in the html files.

You can place your new footer text right above:
<div style="visibility:hidden">

Reply
nel
28/6/2015 01:33:57 pm

can you help me to have my website a footer? bcoz im trying your codes but its not working , i dont have yet footer.

Reply
DDDproduktionen
29/6/2015 12:08:41 am

If you paste a link to your website, I will have a look.

Reply
nel link
29/6/2015 10:52:26 am

my website is already published but
I dont have yet footer please help me as soon as possible this day thank you

DDDproduktionen
29/6/2015 08:17:40 pm

I see you are using the no-header header template. So you have to make your changes in the no-header.html.

The old footer code should look like this:

<div id="footer-wrap">
<div class="container">
<div id="footer">{footer}</div>
</div>
</div>
</div>

Change it to this:

<div id="footer-wrap">
<div class="container">
<div id="footer">
<div style="visibility:hidden">{footer}</div>
</div>
</div>
</div>
</div>

Vadims link
13/8/2015 08:15:08 pm

Thank you very much! It helped

Reply
Jeffrey
17/8/2015 05:42:37 am

Hello, your solution works but has a rather nasty side effect for me.
It causes the mobile site to be without menu, you simply can't get to the menu to ga to another page. Help? Please :)

Reply
Jeffrey
17/8/2015 07:21:35 am

Well the dropdown menu system doesn't work altogeter, not on the web or mobile version.
my tall-header.html:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>

<body class='tall-header-page wsite-theme-light'>

<input type="checkbox" id="navTrigger" />
<div class="nav mobile-nav">{menu}</div>
<div class="wrapper">
<div class="paris-header">
<div class="container">
<label for="navTrigger" class="nav-trigger hamburger"><span></span></label>
<div class="logo">{logo}</div>
<div class="nav desktop-nav">{menu}</div>
</div><!-- end .container -->
</div><!-- end .header -->

<div class="banner-wrap wsite-background">
<div class="container">
<div class="banner">
<h2>{headline:text global="false"}</h2>
<p>{headline-paragraph:text global="false"}</p>
</div>
</div>
</div>


<div class="main-wrap">
<div class="container">
<div class="content-wrap">{content}</div>
</div><!-- end container -->
</div>

<div id="footer-wrap">
<div class="container">
© 2015 Jeffrey Gorissen KSA Maaseik
<div style="visibility:hidden">
<div class="footer">{footer}</div>
</div><!-- end container -->
</div><!-- end footer-wrap -->
</div>

<div class="nav mobile-nav">{menu}</div>

<script type="text/javascript" src="/files/theme/plugins.js"></script>
<script type="text/javascript" src="/files/theme/custom.js"></script>
</body>
</html>

Reply
DDDproduktionen
17/8/2015 10:41:53 pm

Could you post a link to your website?

This code at the end: <div class="nav mobile-nav">{menu}</div> , shouldn't be there.

Jeffrey
18/8/2015 01:17:40 am

www.ksamaaseik.ga is the site.
To my understanding the <div class="nav mobile-nav">{menu}</div> part is to make the menu on mobile devices active, yet when I set the visibility to hidden it also disables the mobile menu, a semi solution that I have made for now is that I placed the <div class="nav mobile-nav">{menu}</div> directly after the losing of 'input type' in the beginning. This causes the menu to work on mobile. But without drop down menus for the sub pages. (not on mobile or Web)

Reply
DDDproduktionen
18/8/2015 10:21:00 pm

With this code it should work again:

<div class="footer-wrap">
<div class="container">
<div class="footer">
© 2015 New Footer
<div style="visibility:hidden">
{footer}</div></div>
</div><!-- end container -->
</div><!-- end footer-wrap -->
</div>

I did a test on a dummy website, and the submenus worked on mobile and desktop.

Jeffrey
18/8/2015 10:39:47 pm

Perfect, thanks so much!
You're amazing!
Keep up your amazing blog and thanks again!

millz
11/9/2015 08:47:21 am

Hello, how do I shorten the height of a banner? The theme i am using (Impact) comes with a banner and the height cannot be changed unless you alter the code. Can you tell me how to do that?

Reply
alessia melia link
30/9/2015 04:02:02 am

Nice! Thanks for edit my site footer on weebly.

Reply
Kim link
17/10/2015 09:16:18 am

I have a Pro account on Weebly.
The Footer HTML looks like this:
How can I remove it?

/* Footer */
.footer-wrap {
width: 100%;
background-color: #262626;
color: #999999;
text-align: right;
font-size: 13px;
}
.footer-wrap .container {
width: 100%;
}
.footer-wrap .wsite-footer {
width: 960px;
margin: 0 auto;
padding: 30px 0 20px;
box-sizing: border-box;
}
.footer-wrap h2 {
margin: 20px 0 10px;
padding-bottom: 10px;
border-bottom: 1px solid #3b3b3b;
color: #ffffff;
text-transform: uppercase;
font-family: 'Open Sans', sans-serif;
font-size: 14px;
font-weight: 400;
line-height: normal;
}
.footer-wrap p {
color: #999999;
font-size: 13px;
}
.footer-wrap blockquote {
color: #999999;
font-size: 13px;
}
.footer-wrap input[type="radio"],
.footer-wrap input[type="checkbox"] {
border: none !important;
}
.footer-wrap input[type="radio"]:checked:after {
background: #2a92e5;
border: 2px solid #181818;
}
.footer-wrap input[type="checkbox"]:after {
background: #181818;
border: solid #2a92e5;
}
.footer-wrap .wsite-form-container {
margin-top: 0;
text-align: left;
}
.footer-wrap .wsite-form-input,
.footer-wrap .wsite-search-element-input {
padding: 10px 6px !important;
background: #181818;
color: #626262;
border: none;
border-radius: 5px;
font-family: 'Open Sans', sans-serif;
font-size: 14px;
font-weight: 400;
line-height: normal;
}
.footer-wrap .form-select {
padding: 10px;
background: #181818 url(select-dropdown.png) 97% center no-repeat;
color: #626262;
border: none;
border-radius: 5px;
font-family: 'Open Sans', sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 15px;
}
.footer-wrap .wsite-button .wsite-button-inner,
.footer-wrap .wsite-button-large .wsite-button-inner {
background: transparent;
color: #2a92e5 !important;
border: 2px solid #2a92e5;
}
.footer-wrap .wsite-button:hover .wsite-button-inner,
.footer-wrap .wsite-button-large:hover .wsite-button-inner {
background: #2a92e5;
color: #ffffff !important;
}

Reply
Klaas de Jong
17/11/2015 05:06:30 am

How do I remove the footer on a smartphone (android)? I did the removal on my website. That works fine in Windows (Chrome), but it keeps appearing in Android.

Reply
james link
13/1/2016 06:00:01 pm

website redirects, how do i get a footer like the on DDDproduktionen is using in this website?

Reply
Salman Saeed link
29/6/2016 03:13:06 pm

How i remove weebly footer and add my own
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>

<body class="no-header-page">

<div class="wrapper">
<div class="paris-header">
<div class="container">
<label class="hamburger"><span></span></label>
<div class="logo">{logo}</div>
<div class="nav desktop-nav">{menu}</div>
</div><!-- end .container -->
</div><!-- end .header -->

<div class="main-wrap">
<div class="container">
<div class="content-wrap">{content}</div>
</div><!-- end container -->
</div>

<div class="footer-wrap">
<div class="container">
<div class="footer">{footer}</div>
</div><!-- end container -->
</div><!-- end footer-wrap -->
</div>

<div class="nav mobile-nav">
<label class="hamburger"><span></span></label>
{menu}
</div>

<script type="text/javascript" src="/files/theme/plugins.js"></script>
<script type="text/javascript" src="/files/theme/custom.js"></script>
</body>
</html>

Reply
DDDproduktionen
2/7/2016 06:08:27 am

<div class="footer-wrap">
<div class="container">
<div class="footer">
<div style="visibility:hidden">{footer}</div>
</div>
</div><!-- end container -->
</div><!-- end footer-wrap -->
</div>

Reply
dj link
11/8/2016 11:16:19 am

it does not worked at all,,im free website builder tell me how can i get rid of powered by weebly footer

Reply
Anonymous
16/9/2016 02:39:05 pm

I tried this and it worked in the preview in the editor,
next I published my site and it still had the footer,
this does not work for the latest version of weebly.

Reply
DDDproduktionen
17/9/2016 05:29:59 am

It should still work.

Reply
Adam link
10/10/2016 09:50:58 am

Please Reply
I can't seem to be able to remove the footer, I tried every both methods you posted and even tried some of the ones you suggested for other, but it still didn't work :/

The code is a little different for the new Weebly websites so I'm not sure how to change it... So I opened the no-header.html page (which is the one I use on my home page) but I can't remove/hide the footer, so could you please edit the code for me? Thanks!

Code (no-header.html):

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>

<body class='no-header-page wsite-theme-light'>

<div class="wrapper">
<div class="cento-header">
<div class="container">
<div class="logo">{logo}</div>
<label class="hamburger"><span></span></label>
</div>
<div class="nav-wrap">
<div class="container">
<div class="nav desktop-nav">{menu}</div>
</div><!-- end .container -->
</div><!-- end .nav-wrap -->
</div><!-- end .header -->

<div class="content-wrap">
{{#sections}}
<div class="container">{content}</div>
{{/sections}}
</div><!-- end content-wrap -->

<div class="nav mobile-nav">{menu}</div>

<script type="text/javascript" src="/files/theme/plugins.js"></script>
<script type="text/javascript" src="/files/theme/custom.js"></script>
<div style='padding: 20px; width:100%; text-align:center;'>{footer}</div>
</body>
</html>

Btw, there was a part of it which I tried editing but it messed it up and made a massive space between the my-added website elements and the footer so I removed it which removed that space but here's the code that I removed and possibly messed up...

<div class="footer-wrap">
<div class="container">
<div class="footer">{footer}</div>
</div><!-- end container -->
</div><!-- end footer-wrap -->
</div>

Reply
DDDproduktionen
11/10/2016 06:35:28 am

Remove this code:

<div style='padding: 20px; width:100%; text-align:center;'>{footer}</div>

And add this modified code bellow the content wrap (</div><!-- end content-wrap -->):

<div class="footer-wrap">
<div class="container">
<div class="footer"></div>
<div style="display:none">{footer}</div>
</div><!-- end container -->
</div><!-- end footer-wrap -->
</div>


Reply
Al link
31/3/2017 06:23:19 am

Hi, I would like to remove a message from the bottom left side of my web page (Photo used under Creative Commons from Alang7™). I do not think it is a part of the footer. I changed the footer a couple of times but the message still remains. I stopped using their pictures long time ago. Can you help me? Thanks, Al

Reply
DDDproduktionen
3/4/2017 11:54:20 am

You should see the code under the no-header header type.(Under THEME > Edit HTML/ CSS > HEADER TYPE).

If not, you may have added the code under SETTINGS > SEO > Footer code.

Reply
Soham Chatterjee link
15/7/2017 09:22:28 pm

I cannot find the code:

<div id="footer">
<div id="footer-content">{footer}</div>

Please help me.....
I found a blog by you where you showed how to change the shortcut icon and it worked perfectly.

Reply
message locker link
21/7/2017 05:46:19 am

Try locking messages instead of hiding

Reply
Jeffrey Gorissen link
26/10/2017 06:44:24 am

Hello, I used your way to hide the footer but as of today 26 th of october I see the weebly adds again. Can you help?

Reply
welly link
28/10/2017 10:44:14 pm

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>

<body class="no-header">

<div class="body-wrap">

<div id="header">
<div class="nav-trigger hamburger">
<div class="open-btn">
<span class="mobile"></span>
<span class="mobile"></span>
<span class="mobile"></span>
</div>
</div>
<div id="sitename">{logo}</div>
</div>

<div id="wrapper">
<div class="bg-wrapper">
<div id="navigation">{menu}</div>
<div id="content-wrapper">
{{#sections}}
<div class="container">{content}</div>
{{/sections}}
</div>
</div>
<div id="footer">
<div id="footer-content">
<br><br>
<div align="center"> © PERNIAGAAN PARIT SULONG 2012-2017

<a href="http://perniagaanparitsulong.weebly.com/ "> My Site </a> |
<a href="http://perniagaanparitsulong.weebly.com/onlinestore.html"> Online Store </a> |
<a href="http://perniagaanparitsulong.weebly.com/contact-us.html"> Contact </a> |
<a href="http://perniagaanparitsulong.weebly.com/about-us.html"> About Us </a> |
<a href="http://perniagaanparitsulong.weebly.com/shipping-policy1.html"> Shipping Policy </a> |
<a href="http://www.ppsulong.com/hiring.html"> Hiring </a>
</div> <br><br> <br><br> <br><br>
<div id="footer" style="display:none">{footer}</div>

</div>
</div>

<div class="navmobile-wrapper">
<div id="navmobile" class="nav">{menu}</div>
</div>

</div>


<script language="javascript" src="/files/theme/plugins.js"></script>
<script language="javascript" src="/files/theme/custom.js"></script>
<script language="javascript" src="/files/theme/mobile.js"></script>

</body>
</html>


(But still the weebly footer is come out.)

Reply
vivelesport link
29/10/2017 12:36:56 am

Hi there
Having a hard time removing footer!
no-header page code is:
------------------------------------------------
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>

<body class="no-header-page">

<div class="wrapper">
<div class="unite-header">
<div class="nav-wrap">
<div class="container">
<label class="hamburger"><span></span></label>
<div class="logo">{logo}</div>
<div class="nav desktop-nav">{menu}</div>
<div class="nav membership-cart">{membership}{minicart}</div>
</div>
</div>
</div>

<div class="main-wrap">
{{#sections}}
<div class="container">{content}</div>
{{/sections}}
</div>

<div class="footer-wrap">
<div class="container">
<div class="footer">{footer}</div>
</div>
</div>
</div>

<div class="nav mobile-nav">
<label class="hamburger"><span></span></label>
{menu}
</div>


<script>
(function(d) {
var config = {
kitId: 'nxe1ajf',
scriptTimeout: 3000,
async: true
},
h=d.documentElement,t=setTimeout(function(){h.className=h.className.replace(/\bwf-loading\b/g,"")+" wf-inactive";},config.scriptTimeout),tk=d.createElement("script"),f=false,s=d.getElementsByTagName("script")[0],a;h.className+=" wf-loading";tk.src='https://use.typekit.net/'+config.kitId+'.js';tk.async=true;tk.onload=tk.onreadystatechange=function(){a=this.readyState;if(f||a&&a!="complete"&&a!="loaded")return;f=true;clearTimeout(t);try{Typekit.load(config)}catch(e){}};s.parentNode.insertBefore(tk,s)
})(document);
</script>

<script type="text/javascript" src="/files/theme/plugins.js"></script>
<script type="text/javascript" src="/files/theme/custom.js"></script>
</body>

</html>

Reply



Leave a Reply.

    DDDproduktionen > Home > Blog

    Twitter

    Tweets by @DDDproduktionen

    Facebook

    Categories

    All
    Background Music
    Breadcrumbs
    Css
    Facebook
    Favicon
    Footer
    Free
    Google+
    Notification Bar
    Paragraph Color
    Scroll To Top
    Table
    Tips And Tricks
    Twitter
    Weebly

DDDproduktionen

  • Home
  • Web Design
  • SEO
  • Video
  • Blog
  • About Us

Info

  • Sitemap
  • Privacy & cookies
  • Contact

Follow Us

  • Facebook
  • Twitter
  • Google+
  • YouTube

Popular posts

  • How to remove the Weebly footer for free
  • How to add a favicon to Weebly for free
  • How to put background music on Weebly
  • How to add a paragraph with background color

Copyright © 2017 DDDproduktionen. All rights reserved. Powered by Weebly

Powered by Create your own unique website with customizable templates.