๐ต๐“๐‘œ๐‘”๐‘”๐’พ๐“ƒ๐‘” ๐‘€๐’ถ๐“ƒ๐“Š๐’ถ๐“

๐Ÿชฝ Angel's Handbook

✧ Learn some magic for your blog!

(I hope this isn't confusing , sometimes i think faster than i write lol bare with me)

Section 1: Choosing a template

On the left side of your screen, you'll see a menu with options like:

  • Posts – where you'll write blog posts.
  • Pages – for permanent pages like "About Me" or your Guidebook.
  • Layout – where you'll add gadgets and move sections around.
  • Theme – where you'll customize how your blog looks.
  • Settings – where you can change your blog's title, description, privacy, and more.

You can preview all the themes and pick which one suits you best!. once you choose your theme, click on customize and you will have the option to change  your background and other options. You can find free backgrounds on sites like Pinterest, Tumblr resource blogs, or by making your own. scrolling more down you can adjusts the widths settings , layout settings and clicking on the advanced section you can scroll and find more options like fonts ,colors, blog titles etc. You will most likely need to use the advanced section the most , it is very helpful. You can also keep previewing your blog on the bottom right to see what you added all together. After all is made to your liking do not forget to save unfortunately autosave isn't a thing :d. 


Section 2: Learning the Layout page. open the layout tab. This is where you'll build your blog.

Here you'll see different sections called gadgets. Gadgets are little boxes that add different features to your website.

The HTML gadget will probably become your best friend because it's what you'll use to add custom decorations, music players, buttons, visitor counters and much more. HTML/javascript is where you paste your codes. You don't need to know how to code much, Most decorations online already come with HTML code. All you have to do is:

  1. Copy the code.
  2. Add an HTML/JavaScript gadget.
  3. Paste the code.
  4. Save.

Over time you'll naturally start recognizing little pieces of HTML and editing them yourself. For some codes I've used go on to https://sydneyssoulscribbles.blogspot.com/p/resources.html page - specifically her resource page and she gives some really cool codes for your blog.

You'll slowly become familiar with tags like:

  • <h1> for headings
  • <p> for paragraphs
  • <img> for pictures
  • <a> for links
  • <div> for sections
Here is a simple code to add images ( i find images on Pinterest and copy the image address)

<img src="IMAGE URL HERE" alt="description" width="300">

Many bloggers build stunning websites without writing every line of code themselves. A-lot of the time you will
1. Find a widget you like
2. Copy the code
3. Paste into
4. Change the colors , images or text to match your blog. Over time, you'll naturally become more comfortable editing HTML and CSS.

Using the image gadget is also very easy and useful I'd suggest finding photos on Pinterest or using your own. Make sure to click the "shrink to fit" setting at the bottom to be sure your images don't take up the whole page.

Section 3: CSS help

CSS controls how things look on your website. This can be found under the advanced section in the theme tab. You can add custom codes to customize features. To find some code make Google searches ("CSS code for a custom cursor") or looking for some resource codes in other sites like tumblr.

๐ŸŽ€ Dolli Tips: Save your blog in another tab while editing so you can refresh and instantly see your changes.

Congratulations! You officially have the foundation of your own blog. Your website will continue changing as you discover new HTML widgets, decorations, and ideas. Mine certainly has. I am still kinda new to blogging and this website so i am also learning with you guys.

Thank you so much for reading, and I hope this guide made Blogger feel a little less overwhelming. Happy blogging! ♡ Sincerely Dolli.

4 comments:

  1. how do you get the little cursor trail?

    ReplyDelete
  2. @moonjellie for the trail i searched up "cursor trail codes embeds" (or search what you want specifically) pick the best described one and copy + paste the embed code into html gadget link

    ReplyDelete
  3. Hey diva!! I had 2 questions. How did you make your side gadget images tilt when you're hovering over them? And how do you add a link when clicking on one of images/gadget?

    ReplyDelete
  4. I'm also wondering how you make the pics tilt ๐Ÿ˜ญ

    ReplyDelete