꩜࿔˚⋆Blog tutorial⋆˚࿔꩜

Hello everyone!

So this blog is a project for my Intro to PW class. At first I was only going to use a basic template and write the required amount of posts. Then I found out how amazing the blogging community is and dove head first into making this page my own. I watched an endless amount of TikTok tutorials and stalked many blog pages, but I gradually started to learn. 

(Shout out @cedes.bookself AKA https://indigenousdivadiary.blogspot.com/) 

This post is for anyone in my class or blogging community that wants to know how I added my fun gadgets, images, and background!

Important: When working on blog, make sure to save everything! You can save your changes by pressing the 'save' button on the bottom far right of your screen. 
Also, blog codes are now their own SEPARATE tab.

You will mainly be using Posts, Pages, Layout, and Theme. Don't worry about anything else. 

  • Posts is where you post your blog entries! When you write a post it will let you preview how it will look on your blog. 
  • Pages is where the tabs will take you (if that makes any sense). For example my Movies! tab. Pages is where I wrote down my favorite movies then posted it. You will see a more thorough explanation on how to make tabs down below. See cross-column to learn how to make pages. 
  • Layout is where it ALL happens. The sidebar games, images, and lists will be added here. I will explain more below. 
  • Theme is where you can pick fonts, colors, and sidebar layouts. This is where you start. 

First things first, pick a theme. I use 'Picture Window Open' with the two sidebars. Then you customize!

Choosing a background was genuinely my biggest obstacle because it meant I had to pick a specific theme/aesthetic. If you know me, you know that I bounce from aesthetic to aesthetic like a ping pong ball. My advice is to not think about it so hard. If you have a color scheme in mind, pick a background that compliments that. You can always change it whenever you want! 

How to change your background: First pick an image you like. Make sure it's simple enough where it doesn't overwhelm your page and makes it hard to read. Then head over to Canva and make a project that is 1,600 x 900 px. Paste your image to that page and mess with it until it looks right. Next, download that image onto your computer. If the image is larger than 3MB, then head over to https://tinyjpg.com/ and that will reduce the MB while still keeping your original image. Finally, go to the theme page, click customize, change image, then upload your image that you downloaded from Canva. You can mess around with it until it looks right to you. 

Note: If your blog title/tabs have a black block surrounding it, don't worry. You can get rid of that in Advanced. 

Adjust widths: This just changes the size of your blog. Mess with the sliders until you like how it looks. Make sure that both side bars are the same size so it looks neat. 

Layout: This is where you can pick where your sidebars are. I have the sidebar on both sides, but feel free to choose what you want.

  • Header is where you will add your blog title. 
  • Cross-Column (Tabs) is where you will add your tabs! You will need to create a page first in order to add it to your tabs. Just create a new page and add a title (If you don't have any material for a page yet, just add 'under construction' to the main text) then publish. After you published, come back to cross-column, click add gadget, click on pages, add a new item, insert the page title, then press save. Repeat for however many tabs you would like to create. 
  • Sidebar (left/right) is very important. This is how you add fun gadgets! Most of the things you can add are pretty self explainable. The two I use the most is HTML/JavaScript and image. I will explain more about how to customize your sidebar below, see gadgets. Click and hold the gadget to arrange the layout. 
  • Footers is something I don't typically use, but it is the same concept as gadgets. 

Advanced: Trying to mess with this took me FOREVER. But I now understand what most of it does. 

  • Page text is where you can change the font and color of your blog posts and sidebar text. 
  • Backgrounds is where you can get rid of the black box surrounding your blog title/tabs. Scroll to header background and click the button to make it transparent. You can also change your blog post background here! I still haven't figured out how to put an image as a background, so for now it's either transparent or a solid color. 
  • Links is where you can change the color of your blog post titles. Do not make it transparent or else it will be invisible. 
  • Blog title is where you can change the font and color of your main blog title. Tabs text does the same thing.
  • Tabs background is where you can get rid of the black box surrounding your tabs. Just click the transparent button on background color and it will go away.
  • Post title is where you can change the size and font of your blog posts title. 
  • Date header just lets you chose the color of the dates.
  • Post is kind of useless IMO. If you want a border around your post, this is where you do it. 
  • Gadgets lets you pick the font and color of the gadgets on your sidebar. Lets use my Song of the Month as an example. Gadgets is where I changed the font of the title. Page text is where I changed the text below the title. 
  • Footer/Footer Links is also kind of useless. It's the same as the rest of the Advanced options.  
  • Add CSS is where it gets confusing. I only used it to change the style of my cursor. https://www.cursors-4u.com/ is the website I used to find the cursor. Click the cursor you want to use then go down to find Get HTML code/CSS. Copy that and paste it here to have a cute cursor! 
Note: Have a blog title and at least one sidebar gadget in order to see what changes you have made. 

Once you are done picking what you want (you WILL come back to advanced to fine tune your page) head over to layout to add your own touches to your blog. 

Gadgets: Where all the fun happens (aside from your blog posts). 
  • HTML/JavaScript was extremely confusing to me at first. Then I realized that it was just copy and pasting. Let me use an example; my tarot cards gadget. I found it on a blog page (I forgot their URL, sorry!) and I clicked the link below. The website provides a code and customization options. Once you have customized, copy the code, paste it into the HTML/JavaScript box (title is optional), then save. The URL for the tarot cards will be in the tab above, see CODES.
  • Image is easy peasy! Select upload image from computer, go on Pinterest (or any place to grab an image), save image as, then select the file. Make sure to shrink image to fit or else it will look wonky. 
  • Lists is also fairly simple. Title your list, select how many items you want, write your first item, save it, then add new items until your list is complete. 
  • Archive is important, it allows viewers to see the other posts you have made. Just select archive, and edit how you want. 
  • Followers is also important. It allows others to follow you and keep updated on your posts.
Note: This is your chance to explore other blogs! Some will have tutorials on how they did their widgets. To dive into the "blogosphere" go to my chat box and click the link to the other blogs. They will also have chats with people linking their blogs as well. This will have you down a rabbit hole. Make sure to leave a follow if you visit their page! 

That is pretty much it... if I missed anything or if you have questions, feel free to leave a comment! If you are one of my classmates, ask me in class! I will be so happy to talk your ear off about my new obsession. 

No comments:

Post a Comment

I hate being an Oklahoman

Hi everyone. So as most of you should know the election was last night and Oklahoma was one of the few states that stayed completely red. I ...