• New? Start Here
  • Money Talk
    • Debt
    • Personal Finance
    • Budget
    • Saving
    • Simple Life
    • Extra Money
  • Build A Financial Foundation
  • Resources
    • FREE Financial Resource Library for Our Subscribers
    • Blogging Resources
      • FREE Blogging Library For Subscribers
    • Share Your Story
    • Facebook
    • Google+
    • Pinterest
    • YouTube

Swimming In Debt

The Trick to edit Blog’s Code

Megan | Leave a Comment

Do you want to adjust some elements of your blog? But you’re not sure where to start to find the exact code you are looking for. Well here is a trick to edit blog’s code the easy way!

Do you want to edit your website design? Here is the easy way to edit your code.

The trick to edit blog's code the easy way

This tutorial is assuming that you are using a WordPress platform. Plus it’s always a wonderful idea to backup your website before making any changes.

BEFORE YOU BEGIN

Before you can start the process you will need a couple of things first.

  1. You need to download the Jetpack Plugin. Then enable the Custom CSS (under Settings-Appearance)
  2. You need a certain internet browsers. I do know this will work with Google Chrome & Firefox.
    • It does not work with Internet Explorer. And I have not tested Safari
  3. You will need a basic understanding of code. Don’t worry you just need to have an understanding! Be sure to check out my post called “Basic Code every Blogger should now”.

Basic HTML & CSS cheatsheet

Once you have done all this you can now begin!

YOUR WEBSITE’S CODE

Here is the easy way to find your website’s code:

  1. Open your website in one of the browsers listed above. I personality use Google Chrome.
  2. Find the item you would like to change
  3. Right click on that item
  4. Then scroll down to the “inspect” or “inspect element” option and click it.The trick to edit blog's code the easy way
  5. A new window will display inside your current page. This is your website’s code.The trick to edit blog's code the easy way

FIND THE CODE

Because you clicked on the item you wanted to change. Its code should be displaying (or a part of it). The box to the right is the CSS code; this is the stuff you will need to change the code on your website. The left box is the HTML code.

TIP: You will maybe have to pick a different HTML element to find the code you need.

Here is the COOL part about using Google Chrome. In the box to the right, you can edit the code there to see how it looks before changing your website’s code. And that’s the TRICK!

The trick to edit blog's code the easy way

This is why you need to have an understanding of basic code to change the CSS code on your website. After you have adjusted the CSS code to the way you want it. Copy the CSS code (ctrl-C for PC).

ADDING THE CODE

Inside your WordPress dashboard, go to appearance then Edit CSS. This is where you will add your new code without adjusting the main code of the website.

The trick to edit blog's code the easy way

SIDE NOTE: My Edit CSS could look different than yours

Now just paste the code into the box and preview it BEFORE saving. Once everything looks the way you want it, save your work.

The trick to edit blog's code the easy way

THE TRICK TO EDIT BLOG’S CODE

Now, this tutorial could have made NO sense to you so I have created a video to show you the process.

I hope this trick will help you edit and design the website you are hoping for. Do you have any questions or additional tricks?

Related

March 22, 2017 | Filed Under: Blogging

« Two Things You Should Not Overlook
Do You Work For You »

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Oh, hi there!

My name is Megan and welcome! We are in pursuit for simplifying our life and becoming debt FREE.

On this blog, you’ll discover resources about budgeting, personal finances, debt, savings, and ideas to earn extra money.

We have paid off 145K and have 10K to go, join us on our adventure. Read More About Us…

OUR DEBT PAYOFF

$0$155,660

Looking for something?

Advertisements




  • Personal Finance
  • Debt
  • Budget
  • Saving
  • Simple Life
  • Blogging

Save some money


Categories

Popular Posts

Have you read these 4 books?

Have you read these 4 books?

Hate Budgeting? Let’s talk!

Hate Budgeting? Let’s talk!

How to Hide an Image on a Post

How to Hide an Image on a Post

Basic Code Every Blogger Should Know

Basic Code Every Blogger Should Know

Let’s start the new year off right!

Let’s start the new year off right!

The Trick to edit Blog’s Code

The Trick to edit Blog’s Code

Start a blog

StudioPress Premium WordPress Themes
Web Hosting

MailerLite Email Marketing for Small Business

BUILD A FINANCIAL FOUNDATION

Copyright © 2019 · glam theme by Restored 316

  • Terms Of Use
  • Disclosure & Privacy Policy
  • About
  • Contact
  • Work With Us
This site uses cookies to ensure you get the best experience. Find out more.