Bootstrap broke

Hello! I got some issue here and Im trying to find a solution… As you may already know Im trying to add a very painfully in there where you know :stuck_out_tongue_winking_eye: code to my site.
I mean I have zero knowledge about coding but when adding the code on clean the the site will work and the widget is fully funcional.

        <?php

        require_once 'rwdGate.php';

        $rwdgate = new rwdGate('692226d88aa72d');

        $widgets = array(132463937, 132465852);

        $rwdgate->fetch($widgets);

        if ($rwdgate->isRawResult())
        {
          $rwdgate->printRawResult();
          die();
        }

        ?>
        <!DOCTYPE html>
          <head>
            <?php echo $rwdgate->getSection('HEAD'); ?>
          </head>
          <body class="homePage">

          <div id="wrap">

            <?php
            $menuFile = basename(__FILE__);

            $list = $rwdgate->getSectionsList();

            if(in_array('132463937', $list))
            {
              echo '<div>'.$rwdgate->getSection('132463937').'</div>';
            }

            if(in_array('132465852', $list))
            {
              echo '<div>'.$rwdgate->getSection('132465852').'</div>';
            }

            if(in_array('BODY', $list))
            {
              echo $rwdgate->getSection('BODY');
            }

            ?>

          </div>

        <?php
          if(in_array('FOOTER', $list)) {
            echo $rwdgate->getSection('FOOTER');
          }
          ?>
          </body>
        </html>

But as soon I will implement it on blocs nothing will work!

<?php

require_once 'rwdGate.php';

$rwdgate = new rwdGate('692226d88aa72d');

$widgets = array(132463937, 132465852);

$rwdgate->fetch($widgets);

if ($rwdgate->isRawResult())
{
  $rwdgate->printRawResult();
  die();
}

?>

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
    <link rel="shortcut icon" type="image/png" href="favicon.png">
    
	<link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css?7098">
	<link rel="stylesheet" type="text/css" href="style.css?5683">
	<link rel="stylesheet" type="text/css" href="./css/font-awesome.min.css">
	
    <title>Home</title>
<?php echo $rwdgate->getSection('HEAD'); ?>

    
<!-- Analytics -->
 
<!-- Analytics END -->
    
</head>
<body>
<!-- Main container -->
<div class="page-container">
    
<!-- search -->
<div class="bloc l-bloc full-width-bloc" id="search">
	<div class="container bloc-md">
		<div class="row no-gutters">
			<div class="col">
				<div class="  ">
					  <div id="wrap">

    <?php
    $menuFile = basename(__FILE__);

    $list = $rwdgate->getSectionsList();

    if(in_array('132463937', $list))
    {
      echo '<div>'.$rwdgate->getSection('132463937').'</div>';
    }

    if(in_array('132465852', $list))
    {
      echo '<div>'.$rwdgate->getSection('132465852').'</div>';
    }

    if(in_array('BODY', $list))
    {
      echo $rwdgate->getSection('BODY');
    }

    ?>

  </div>
					
				</div>
			</div>
		</div>
	</div>
</div>
<!-- search END -->

<!-- ScrollToTop Button -->
<a class="bloc-button btn btn-d scrollToTop" onclick="scrollToTarget('1',this)"><span class="fa fa-chevron-up"></span></a>
<!-- ScrollToTop Button END-->


</div>
<!-- Main container END -->
    

<script src="./js/jquery-3.3.1.min.js?7029"></script>
<script src="./js/bootstrap.bundle.min.js?6604"></script>
<script src="./js/blocs.min.js?5286"></script>
<script src="./js/lazysizes.min.js" defer></script>
<!-- Additional JS END -->

<?php
  if(in_array('FOOTER', $list)) {
    echo $rwdgate->getSection('FOOTER');
  }
  ?>

<!-- Preloader -->
<div id="page-loading-blocs-notifaction" class="page-preloader"></div>
<!-- Preloader END -->

</body>
</html>

but if I remove this from the code it works again but I lose all the style of the page:

<link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css?7098">
	<link rel="stylesheet" type="text/css" href="style.css?5683">
	<link rel="stylesheet" type="text/css" href="./css/font-awesome.min.css">

<script src="./js/jquery-3.3.1.min.js?7029"></script>
<script src="./js/bootstrap.bundle.min.js?6604"></script>
<script src="./js/blocs.min.js?5286"></script>
<script src="./js/lazysizes.min.js" defer></script>

So I asume is something with blocs and bootstrap! How to fix it? mmm thats the bigger question… If any of the developers could give me a hint on this? @Norm?

Hi @Stewie_Griffin

Looks like a CSS display class issue. Do you have an URL to inspect this ?

MDS

Yes here: http://www.lostonyouagency.com thats just a provisional site the original www.volfly.net has the whole code and is even worse

Hi @Stewie_Griffin

There indeed appears to be conflicts between Bootstrap/Blocs classes and the RWD classes.

For instance if you set the following in the page header code with the style tags:

.nav {
display: block!important;
}

it will correct the navigation, and then you will need to correct the display for other items as well…

However, in my opinion I believe the whole setting is sort of screwed up. It is difficult to tell what is wrong without seeing the actual blocs file.

MDS

This one doest work!

.nav {
display: block!important;
}

I have tried before! :confused:

Well it works as per the screenshot. ?!

If you want to PM the blocs file I can check further.

MDS

Ok! will upload them for you! thanks a lot! :smiley:

Will do my best but cannot promise I will succeed :wink:

I understand :frowning: but thank you so much :smiley: