How To Host Blogger CSS and JavaScript Files in Google Drive
Anyone who has worked in web design or development can tell you that where you save your files is important. Every time someone visits your site, the server or host will go to that location and display the relevant files. Where you decide to store your files will affect several important aspects such as your page load speed, your overall SEO ranking and your ability to make necessary changes to the site.
A slow loading speed can negatively affect your SEO rankings because the slower your site is, the less likely visitors are to wait for it to load. If someone visits your site and immediately clicks the "Back" button because it's taking too long to load, it will increase your bounce rate and provide Google with statistics showing that your site is low quality or irrelevant to them. search keywords.
Clear file structures and a central location encourage you to organize and name everything appropriately. All content related to your website or blog topic will be in one place for web crawlers to examine.
This is something to think about if you own a blogger site. When you need to make changes to things like social sharing buttons, popular posts, recent posts, and related post widgets, you need to know where it all goes or risk losing content and available money.
Some large websites that generate hundreds of unique articles per month cannot afford to put content in multiple places. When offline articles start moving, they run the risk of duplicating content on your website or forgetting about it altogether. Things need to be close at hand to minimize errors and reduce time spent editing the site while it's live.
Google Drive offers enough space to store large files and offers collaboration services so you can work on the same project with different team members. Some of the files you upload to cloud services may not be published and remain on private sites, while other files, such as blog posts, may be published or stored on public sites.
Another useful feature of saving all your Blogger files to Google Drive is that it is very secure. Google is backed by one of the world's leading technology companies, so you can be sure that your content is safe from hackers and those who want to compromise your site.
This step-by-step guide will take you through setting up your Blogger site with Google Drive. Taking advantage of this strategy is completely free and will provide you with a solid platform to build your blog.
For example, the link to mycssfile.css that I copied looks like this:
If you want to add a CSS file, type the following tag in the search box and hit enter to find it:
only under tag, add this line:
If you want to add a JavaScript file, see the following tag:
And add this line above:
Replace the blue line with your URL:
Finally, press the "Save Template" button to save the changes And you're ready!
The next time you want to edit information or move internal files, just open the Google Drive folder in your account and make your changes from there. These files will be automatically synced to your online folder and updated on your site. It works the same if you want to change the look by modifying the CSS code to expand or adjust the header, footer.
As you can see, changing file storage so that CSS and JavaScript are stored in your Google Drive account is easy and only takes a few minutes. Once you've changed, you can start enjoying faster loading speeds, higher SEO rankings, and a more convenient overall platform to work from to improve your work efficiency.
something to think about
When designing your inline structure and where to store your important CSS and JavaScript files, here's a quick overview of how this decision can affect your page:Website loading speed
By consolidating multiple tabs and style files on a website, Blogger Server only needs to collect data from one location. When you share your files or decentralize your file system, it takes longer for all the data to come together to feed your site.A slow loading speed can negatively affect your SEO rankings because the slower your site is, the less likely visitors are to wait for it to load. If someone visits your site and immediately clicks the "Back" button because it's taking too long to load, it will increase your bounce rate and provide Google with statistics showing that your site is low quality or irrelevant to them. search keywords.
File storage affects SEO
In addition to increasing your bounce rate, storing your files in a central location and managing your filenames can affect your site's SEO. Web crawlers used by Google or other search engines index your site code as well as your file names and directories. If the filenames are random or placed in the wrong category, crawlers won't know what to do with the information.Clear file structures and a central location encourage you to organize and name everything appropriately. All content related to your website or blog topic will be in one place for web crawlers to examine.
Saving location affects editing capabilities
Browsing through files and folders or opening FTP connections to make simple edits can be tedious and take up a lot of time that could otherwise be spent writing new content.This is something to think about if you own a blogger site. When you need to make changes to things like social sharing buttons, popular posts, recent posts, and related post widgets, you need to know where it all goes or risk losing content and available money.
Some large websites that generate hundreds of unique articles per month cannot afford to put content in multiple places. When offline articles start moving, they run the risk of duplicating content on your website or forgetting about it altogether. Things need to be close at hand to minimize errors and reduce time spent editing the site while it's live.
Saving JavaScript/CSS files with Google Drive
Storing Blogger CSS and JavaScript files in Google Drive will help you eliminate all the aforementioned issues and reduce the clutter of your services. Using this method can boost your site speed, increase your chances of a successful SEO campaign, and make your life easier.Google Drive offers enough space to store large files and offers collaboration services so you can work on the same project with different team members. Some of the files you upload to cloud services may not be published and remain on private sites, while other files, such as blog posts, may be published or stored on public sites.
Another useful feature of saving all your Blogger files to Google Drive is that it is very secure. Google is backed by one of the world's leading technology companies, so you can be sure that your content is safe from hackers and those who want to compromise your site.
This step-by-step guide will take you through setting up your Blogger site with Google Drive. Taking advantage of this strategy is completely free and will provide you with a solid platform to build your blog.
Step 1. Prepare the CSS/JavaScript File
- First, we need to create the file we want to put. To host a CSS file, open Notepad and paste the CSS code (if includedtags, remove them).
- From the Notepad menu, select 'File' > 'Save As' and enter the name of the file with the .css extension like I did for mycssfile.css; See screenshot below.
- In the same window, select "All files" in the "Save as type" option and set the character encoding to UTF-8.
- If you want to host a JavaScript file, add the extension .js (instead of .css) to the end of your filename (remove label if you can see it). Click "Save" and browse to where you want to save the file.
Step 2. Upload your file to Google Drive
- Go to https://drive.google.com and sign in with your Gmail account. Once logged in, click the "Create" button and add a new separate folder to upload your JavaScript and CSS files.
- Open the newly created folder and click on the Up Arrow button to select the required files to upload
- Now go to where you saved the files, select them (to select multiple files, press and hold the Ctrl key on your keyboard then click) and press the Open button.
- Once the files are successfully uploaded, right-click on the filenames (to select all your files in the folder, click the checkbox) and select "Share":
- In the "Sharing Settings" window, click on the "Edit" link and select the "Public on the web" option. Hit "Save" and copy the links to your downloaded files from the blue highlighted "Share link" box, then paste them into a notepad for later use.
Step 3. How to add an external CSS/JavaScript file to Blogger
Before you can use links, you need to replace ' https://drive.google.com/file/d ' with ' https://googledrive.com/host ' and remove ' /edit?usp=sharing ' in the link . will beFor example, the link to mycssfile.css that I copied looks like this:
https://drive.google.com/file/d/0B4n9GL3eVuV-TkphMkc3SFR2Slk/edit? usp = sharedNotice the blue part after the "/file/d/" part. This is the ID of the file used to access it through the new hosting service. It should start with the following URL:
https://googledrive.com/host/Add the file id like this ('delete' part /edit?usp=share'):
https://googledrive.com/host/0B4n9GL3eVuV-TkphMkc3SFR2SlkNow login to your blogger account, select your blog and go to Template > Edit HTML. Click anywhere in the code box and press CTRL+F to open the search box:
If you want to add a CSS file, type the following tag in the search box and hit enter to find it:
only under tag, add this line:
https://googledrive.com/host/0B4n9GL3eVuV-TkphMkc3SFR2Slk" />And replace https://googledrive.com/host/0B4n9GL3eVuV-TkphMkc3SFR2Slk with the link of your CSS file:
If you want to add a JavaScript file, see the following tag:
And add this line above:
Replace the blue line with your URL:
Finally, press the "Save Template" button to save the changes And you're ready!
at the end
Once you have saved all your files and locked the drive, open your site in a browser and confirm that all changes have been made successfully.The next time you want to edit information or move internal files, just open the Google Drive folder in your account and make your changes from there. These files will be automatically synced to your online folder and updated on your site. It works the same if you want to change the look by modifying the CSS code to expand or adjust the header, footer.
As you can see, changing file storage so that CSS and JavaScript are stored in your Google Drive account is easy and only takes a few minutes. Once you've changed, you can start enjoying faster loading speeds, higher SEO rankings, and a more convenient overall platform to work from to improve your work efficiency.
Post a Comment for "How To Host Blogger CSS and JavaScript Files in Google Drive"