Then paste this code, and check it out. It is a really rough piece but it will get you going.



To change text size do this:

Type in your text

Your text will have no formatting (if you typed it in a clear unformulated section of the edit window).

I myself do not know the code from scratch but I have deciphered it enough to be able to modify it to my will when the code is already there.

So to get the code “there”, just click on the text (to put the cursor on the same line of the text) or just highlight the text and justify it left, center, or right.

Lets try it :

“This is a Sample piece of text”

 

This text should not be formatted. So I will click on it and justify it left.

“This is a Sample piece of text”

In the “Visual” representation, you will not notice anything because it was already left justified, but in the text representation this happened:

<p style=”text-align: left;”>”This is a Sample piece of text“</p>

What I then do is (in the text mode) I replace the “style=”text-align: left;” with “style=”font-size: 350%;“, like so:

<p style=”font-size: 350%;”>”This is a Sample piece of text”</p>

Then when you switch to visual mode:

“This is a Sample piece of text”

You can then edit it how ever you see fit from the edit menu, like change colors and such

This is a Sample piece of text

You can also get creative like this

Look I am so small but I can get really BIG and then go back to small.

You may not understand the code, but you can use this piece of code and change the words how you see fit and still use it


Full width bars:
These will only work when you do not have a side bar layout. You need to have a piece of code in your CCS section that houses all the characteristics of your side bar, such as the color of the bar all the margins etc. etc.

Like this:

.row-full4 {
width: 100vw;
position: relative;
margin-left: -50vw;
margin-top: 1.5rem;
margin-bottom: 1.5rem;
left: 50%;
background: #db4a39;
background-position: left;
background-repeat: no-repeat;
}

(The name of this “full width bar engine” = row-full4)

The full width bar then that you call up in your content will have all these characteristics you have set in that code.

If you now need a second full width bar, that now has different characteristics, like a blue color like a facebook full width bar, you put a second piece of code in that CSS section with THOSE characteristics.

 

So lets say you want to create 2 full width bars. One is red for google, and one is blue for facebook (like I have on my website

You could do it like this

 

.GoogleFWB {
width: 100vw;
position: relative;
margin-left: -50vw;
margin-top: 1.5rem;
margin-bottom: 1.5rem;
left: 50%;
background: #db4a39;
background-position: left;
background-repeat: no-repeat;
}

AND

.FacebookFWB {
width: 100vw;
position: relative;
margin-left: -50vw;
margin-top: 1.5rem;
margin-bottom: 1.5rem;
left: 50%;
background: #db4a39;
background-position: left;
background-repeat: no-repeat;
}

If you called up the googleFWB, the full width bar on your site will then have the google colors and all parameters you have set for that bar (like the margins).

Obviously, when you just copy the code of this page in your page these full width bars won’t work because you do not yet have the code installed in your CSS section.

 

So now..

HOW do you call up the full width bar on your page?

<div class=”CompanyOrangeBar”>
<div class=”imageBox”>

Text or picture inside the bar

</div>
</div>

So the following code:

<div class=”CompanyOrangeBar”>
<div class=”imageBox”>

<a href=”https://www.webuyhousesinconnecticut.com/sell-your-house-in-connecticut/”><img class=”aligncenter wp-image-12352 size-full” src=”https://cdn.carrot.com/uploads/sites/10050/2019/03/We-Buy-Houses-In-Connecticut.png” alt=”We Buy Houses In Connecticut” width=”1234″ height=”258″ /></a>

</div>
</div>

looks like this:

 

Like so:

We Buy Houses In Connecticut