HTML CMS Code using Layout Grids

All WYSIWYG Web Builder support issues that are not covered in the forums below.
Forum rules
IMPORTANT NOTE!!

DO YOU HAVE A QUESTION OR PROBLEM AND WANT QUICK HELP?
THEN PLEASE SHARE A "DEMO" PROJECT.



PLEASE READ THE FORUM RULES BEFORE YOU POST:
http://www.wysiwygwebbuilder.com/forum/viewtopic.php?f=12&t=1901

MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
Post Reply
cfardon
 
 
Posts: 12
Joined: Thu Feb 25, 2021 11:13 pm

HTML CMS Code using Layout Grids

Post by cfardon »

Hi,

I have an external CMS editor that i prefer to use. To use it generates a javascript code to enter so that is displays the editing from the cms. (See code pasted below). When i insert an html box in my site it works perfectly. But i use layout grids and when i drag the html box into a layout grid it disappear when previewing the page.

What i am needing to do, is paste the code and have it appear in order on my page and at the same width (1024) as the rest of my page.
I have tried the following.

1. I place a html box on my page and paste the code into the box - it works perfectly.
2. If i place the html box in a layout box - it doesn't work at all, there is not text from the CMS displays on my page.
3. I i right click on the layout grid and attach the html and place it "inside the tags" the text from the cms then display s on my page, but it appears on the left hand edge of the browser window instead of being aligned with the rest of my page. if i set the layout grid to maximum width 1024, it makes no difference.

After I upload the site and check the page source it is like this: (The code is not between the grid 16 tags...

<div id="wb_indexLayoutGrid16">

<div id="indexLayoutGrid16">

<div class="row">

<div class="col-1">

<div id="indexHtml1" style="display:inline-block;width:982px;height:229px;z-index:18">

<link href="https://www.fardonwebhosting.com/cms/in ... ionLoadCss" rel="stylesheet"/>

<script src="https://www.fardonwebhosting.com/cms/in ... "></script>
</div>

</div>

If i manually change this to look like:


<div id="wb_indexLayoutGrid16">
<div class="row">

<div class="col-1">

<div id="indexHtml1" style="display:inline-block;width:982px;height:229px;z-index:18">

<link href="https://www.fardonwebhosting.com/cms/in ... ionLoadCss" rel="stylesheet"/>

<script src="https://www.fardonwebhosting.com/cms/in ... "></script>
</div>

</div>

<div id="indexLayoutGrid16">

Then everything works fine, but is a pain to keep having to manually do the edit every time i upload something.

Anyone have any ideas how i could fix this?

Thanks in advance
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: HTML CMS Code using Layout Grids

Post by crispy68 »

Well for one, you are missing an ending </script> tag in your code.
cfardon
 
 
Posts: 12
Joined: Thu Feb 25, 2021 11:13 pm

Re: HTML CMS Code using Layout Grids

Post by cfardon »

I probable havent pasted all the code in........but my main probem is that if i paste the code and then put the html box in a layout grid......when it uploads it seems to put the code out side the layout grid tags.
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: HTML CMS Code using Layout Grids

Post by crispy68 »

What exactly is the code you are posting? Is this a phpjabbers code by chance?
cfardon
 
 
Posts: 12
Joined: Thu Feb 25, 2021 11:13 pm

Re: HTML CMS Code using Layout Grids

Post by cfardon »

Hi Yes,

you can view it on this page here what the outlook looks like. it is just under the 2 videos near the top saying.
We are changing the way the world seals concrete.


https://www.sitetest.fardonweb.com
cfardon
 
 
Posts: 12
Joined: Thu Feb 25, 2021 11:13 pm

Re: HTML CMS Code using Layout Grids

Post by cfardon »

oh the code is:

<link href="https://www.fardonwebhosting.com/cms/in ... ionLoadCss" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="https://www.fardonwebhosting.com/cms/in ... "></script>
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: HTML CMS Code using Layout Grids

Post by crispy68 »

I seem to have got it working. Make sure:

1. Your html box is set to: Do Not use <div>
2. Go to Tools --> Options --> HTML and make sure in the Javascript section that "Move Javascripts to end of the page" is unchecked.
cfardon
 
 
Posts: 12
Joined: Thu Feb 25, 2021 11:13 pm

Re: HTML CMS Code using Layout Grids

Post by cfardon »

Hi, Yes i had already did that setting in the options. still doesnt work properly.
User avatar
BaconFries
 
 
Posts: 5328
Joined: Thu Aug 16, 2007 7:32 pm

Re: HTML CMS Code using Layout Grids

Post by BaconFries »

Viewing the source code, I can see that you may have enabled HTML beautifier, can you please go to Tools > Options > HTML and disable this feature along with inline styles and try again.
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: HTML CMS Code using Layout Grids

Post by crispy68 »

Hi, Yes i had already did that setting in the options. still doesnt work properly.
Changing the option in Tools worked for me.

Here is the result I get:

Image
Note: I added a blue background just so it would be easy to see the results. See grid setup below.


Here is the html box with your code:

Image


Here is the layout grid options. Very plain jane....

Image


Here is what it looks like in the workspace:

Image


Here are the options under Tools --> HTML

Image

As you can see, with everything I have checked it works. The main thing is you do not want to move javascripts to the end of the page. If this box is checked then WB is going to remove the <script> from the layout grid and place it at the bottom which means the layout grid no longer controls the layout of your script.

If it still doesnt work for you then there has to be something else on your page causing an issue. Do you have any other code you've added to the page yourself? When you preview the page on Chrome and use the inspector tool are there any errors?
cfardon
 
 
Posts: 12
Joined: Thu Feb 25, 2021 11:13 pm

Re: HTML CMS Code using Layout Grids

Post by cfardon »

Thank you everyone. I am most grateful....it seems to be working good now :)
cfardon
 
 
Posts: 12
Joined: Thu Feb 25, 2021 11:13 pm

Re: HTML CMS Code using Layout Grids

Post by cfardon »

Hi, I still seem to be having some problems:

To view the pages Please use:
username: stoned
Password: Stoned2021

Its working where it says "Changing the way we seal concrete"
https://www.sitetest.fardonweb.com/index.html

on
https://www.sitetest.fardonweb.com/locations.html
It is working where i put a html box and no layout grid. But straight under where i have typed "here is the script in a layout grid" it is not working.

I have looked at the source code for both pages yet the script seems to be the same layout.
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: HTML CMS Code using Layout Grids

Post by crispy68 »

The issue is this... in a layout grid, the font size is initially set to zero to not add any height to the grid. Since it is zero, you don't see your text.

In the regular html box, this is not the case which is why you see it.

So, if you want it to work in the grid you will need to override the font size. Go to Page --> Page HTML --> between <head> tags and put this code:

Code: Select all

<style>
#LayoutGrid1 > .row > .col-1{font-size:initial;}
</style>
You will need to change LayoutGrid1 to the name(ID) of your layout grid and change the column # to whatever column you put the code into.
cfardon
 
 
Posts: 12
Joined: Thu Feb 25, 2021 11:13 pm

Re: HTML CMS Code using Layout Grids

Post by cfardon »

Hey, Thank you....i have been looking for a solution for over 12 months now.....this is the first that has fixed the problem completely and works.

I have just one question if I may.

If i wanted a specific font and colour to automatically be used from the CMS can i edit this code you gave me?
Eg: Font: Roboto Size: 14 Colour: White

<style>
#LayoutGrid1 > .row > .col-1{font-size:initial;}
</style>

Thank you once again for your help
User avatar
crispy68
 
 
Posts: 2737
Joined: Thu Oct 23, 2014 12:43 am
Location: Acworth, GA
Contact:

Re: HTML CMS Code using Layout Grids

Post by crispy68 »

You probably could; however, the font color and size should be able to be chosen in the editor for the CMS script. This is where you would ultimately want to be able to change it. I believe the # of fonts is limited within the script; however, you may be able to add a font. There may be a folder with the script that contains all the fonts. I would have to look to confirm.
Post Reply