Basically, every Weebly site has its own database for files that can be accessible anytime. This database can be seen on your Design Tab along with your page lay outs and your main-style.css. You can upload files including images, JavaScripts, CSS and others with unknown space limit. You can also delete them anytime. It is important to upload and host your own files for future reference and lessen your worry about its availability. Of course, an exemption would be those jQuery library files that are stored in more stable and secured sites like Google.
1. Downloading JS and CSS files
Most tutorial sites offer a direct download for these files in a zip form. However, I imitated the style of Dynamic Drive using the "right click" technique. For example below:
The file above is an external CSS (Cascading Style Sheets) which is an essential part of every tutorial. You can download the above file by right clicking on it and choose "save link as", select your saving location in your computer and save. You will then upload them in your template which will be discussed on number two. Remember not to rename the file or change its extension.
2. Uploading Files on your Weebly Site
In Weebly, you can upload files in 3 ways:
a. Using the image drag and drag elements for photos.
b. Using the "FILE" drag and drop element or the “File Submission” in the RSVP form for PRO accounts.
c. Using your main database located in your Design Tab.
The most appropriate choice for my tutorials will be letter C. Once you downloaded the files on Step one, you need to upload them (CSS,JS, images..etc) on your database. To do that simply go to Design Tab > Edit CSS/HTML > Add new file(s). There you can choose the files you need to upload. Save your template after that.
3. Editing/ Creating External Files
The best way to describe this is to read my article “How to Edit External or Downloadable CSS File”.
Conclusion
This topic is one of the most important things every Weebly Users and Editors must know. It’s actually easy to remember how to use your database for your files. Later on, I will link this information to all my future tutorials.
When I try to add a CSS/jquery file to my weebly theme it doesn't store
ReplyDeleteI've read that you can only have one .css file.
I am not sure why I cannot upload the jquery, perhaps because it is a free account?
ZZZ... G, please read carefully, add CSS file via "add new files" then execute it trough the header section.
ReplyDeleteHi Domingo, Thanks for all your great widgets.
ReplyDeleteIm having a tiny problem.. I am trying to impliment your image hover. I have successfully added the image source, edited the header code to my site, and have successfully made an href// link via the hover. However, the image is just the source image with the text overlay. it does not animate when mouse rolls over, just stays there with source image and text over it with the link, which works. But not like your examples! I have added the alloriginals10.css and have embedded the div code. What do you think I should try so i get them like yours?
Hi Stoop,
DeleteIn order to see if you did it correctly, I would suggest you to paste this on the forum with your site address. With that, I can check the codes.
Hi domingo i'm trying to add download your file but it says its no longer available what do I do?
ReplyDeleteHi Tenneh,
DeleteSimply riht click on the sample CSS and choose save link as. That will do.