How to set up Google Doc as your blog on Carrd:1. Start writing your blog post on Google Docs.
- The blog posts can be written on a single Google Doc document. Example doc here. To indicate the blog post title and date, use the ---POST--- and ---DATE--- formatting below:---POST--- The Future of Transportation
---DATE--- 2023-10-30
The transportation sector is on the cusp of major changes, driven by technological innovations and environmental concerns. Electric vehicles are becoming more mainstream, with improving battery technology extending their range and reducing costs...
 
---POST--- The Importance of Digital Literacy
---DATE--- 2023-10-15
In our increasingly digital world, digital literacy has become a crucial skill. It goes beyond basic computer skills to encompass the ability to find, evaluate, and communicate information on digital platforms...


2. Set up the Google Doc for publishing:
- Make sure the Google Doc is set to "Anyone with the link can view" for public access.
- Note down the document ID from the URL of the Google Doc. For example, if the URL looks like this:https://docs.google.com/document/d/1If6bkw8io7Aht2qPTKc_eFQSimZRkf0b77EJkOmDXeQ/edit?tab=t.0Then the document ID is 1If6bkw8io7Aht2qPTKc_eFQSimZRkf0b77EJkOmDXeQ- When in the Google Doc page, go to the menu, click on Extensions → Apps Script. This will open a new window in Google Apps Script, for step #3...


3. Create a Google Apps Script:
- Go to script.google.com and create a new project.
- Use the following code, paste it into the code field in the project.


4. Deploy the script as a web app:
- In Google Apps Script, click on "Deploy" > "New deployment"
- Choose "Web app" as the type
- Set "Execute as" to your account
- Set "Who has access" to "Anyone"
- Click "Deploy" and copy the provided URL for web app
- NOTE: Google Apps Script has quota limits.


5. Set up your Embed element in your Carrd site:
- Click on the Embed element Blog plugin in the Blog plugin carrd template. Select all and copy all the code.
- Paste the code in the Embed element in your Carrd site. Name the Embed "blog plugin"
- In the code, look for GOOGLE_APPS_SCRIPT_URL and change the URL for the Google Apps Script. Likewise for GOOGLE_DOC_ID - change it to the ID of your Google Doc (see step #2)
- Don't forget to uncheck the "Defer script tags" option setting below!
- Publish site, and blog is live!


6. Style your embedded blog:
- Click on the Embed element.
- To change the "Load more" button color, look for this code in the <style> tags:#load-more-button {
background-color: #F2B266;
color: white;
font-weight: 600;
margin: 1rem 1rem 1rem 0;
padding: 0.625rem 1.25rem;
border-radius: 0.2rem;
transition: all 0.15s ease-in-out;
border: none;
cursor: pointer;
font-size: 0.875rem;
line-height: 1.25rem;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
text-align: center;
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 120px;
}
Edit the background-color to your preferred color hex code.
 
- To change the fonts, look for this code in the <style> tags:#blog-wrapper {
font-family: Arial, sans-serif;
line-height: 1.6;
margin: 0;
padding: 20px;
max-width: 1000px;
margin: 0 auto;
}
Edit the font-family, or @import your own fonts from Google Fonts.
 
- To background color of the blog post, look for this code in the <style> tags:.blog-post {
background-color: #eeeeee;
padding: 30px 40px;
border-radius: 5px;
margin-bottom: 20px;
}
Edit the background-color to your preferred color hex code.