Post by BrandonBerner » Mon May 23, 2016 1:21 pm

Im running OC 2.0.3.1

I am trying to add this HTML code to my information page called "FAQ".

When I add this code into my information page under Code-View, it freezes opencart.

What code do i need to delete in order for this code to not freeze opencart?

Thanks! :)

Code: Select all

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>

<div data-role="page" id="pageone">
  <div data-role="header">
    <h1>Collapsible Sets</h1>
  </div>

  <div data-role="main" class="ui-content">
    <div data-role="collapsibleset">
      <div data-role="collapsible">
        <h3>Click me - I'm collapsible!</h3>
        <p>I'm the expanded content.</p>
      </div>
      <div data-role="collapsible">
        <h3>Click me - I'm collapsible!</h3>
        <p>I'm the expanded content.</p>
      </div>
      <div data-role="collapsible">
        <h3>Click me - I'm collapsible!</h3>
        <p>I'm the expanded content.</p>
      </div>
      <div data-role="collapsible">
        <h3>Click me - I'm collapsible!</h3>
        <p>I'm the expanded content.</p>
      </div>
    </div>
  </div>

  <div data-role="footer">
    <h1>Insert Footer Text Here</h1>
  </div>
</div> 

</body>
</html>

Active Member

Posts

Joined
Sat Dec 15, 2012 4:49 am

Post by cyclops12 » Mon May 23, 2016 5:20 pm

I have just copied and pasted that code into Code View in an about page on a test version 2.0.3.1 and all works ok
collapse.JPG

collapse.JPG (49.33 KiB) Viewed 904 times

Last edited by cyclops12 on Tue May 24, 2016 1:07 am, edited 1 time in total.

Active Member
Online

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by cyclops12 » Tue May 24, 2016 1:00 am

Aha i see what you mean now....back end completely frozen, can delete code but cant save!!

Active Member
Online

Posts

Joined
Sun Sep 27, 2015 1:10 am

Post by BrandonBerner » Tue May 24, 2016 5:54 am

cyclops12 wrote:Aha i see what you mean now....back end completely frozen, can delete code but cant save!!
Yea, Its very anoying, I managed to save it, but once I do, and I want to add or edit something, My Bold, Underline, Code View and other options disappear and I have to delete the page and try again.

Any solution to adding this feature without it glitching like crazy?

Active Member

Posts

Joined
Sat Dec 15, 2012 4:49 am

Post by villagedefrance » Tue May 24, 2016 7:04 am

I think you should remove the <head> ... content ... </head> completely, and the <body> tag itself, as well as the closing </body> tag itself.

Remember, you can only have 1 <head> and 1 <body> in an html document. Opencart already loads its own (with jQuery) and is already responsive so in theory you don't need to load the jQuery Mobile framework either.
You just need to make sure the content inside your <body> tag is Bootstrap friendly and all should work correctly.

OpenCart custom solutions @ https://villagedefrance.net


User avatar
Active Member

Posts

Joined
Wed Oct 13, 2010 10:35 pm
Location - UK

Post by BrandonBerner » Tue May 24, 2016 9:32 am

villagedefrance wrote:I think you should remove the <head> ... content ... </head> completely, and the <body> tag itself, as well as the closing </body> tag itself.

Remember, you can only have 1 <head> and 1 <body> in an html document. Opencart already loads its own (with jQuery) and is already responsive so in theory you don't need to load the jQuery Mobile framework either.
You just need to make sure the content inside your <body> tag is Bootstrap friendly and all should work correctly.
Thanks for your help.

I am still not able to get it to work correctly.

When I delete the <header> information this also deletes the style sheet and functionality of collapsing.

Any other advice?

Thanks :)

Active Member

Posts

Joined
Sat Dec 15, 2012 4:49 am

Post by cyclops12 » Thu May 26, 2016 3:27 am

What about a bootstrap collapse, then you dont have to link to external scripts and css sheets...

I tried this and works ok

Code: Select all

<div id="accordion" role="tablist" aria-multiselectable="true">
  <div class="panel panel-default">
    <div class="panel-heading" role="tab" id="headingOne">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
          Click me - I'm collapsible!
        </a>
      </h4>
    </div>
    <div id="collapseOne" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
    <h4> Content for question 1</h4>
    </div>
  </div>
  <div class="panel panel-default">
    <div class="panel-heading" role="tab" id="headingTwo">
      <h4 class="panel-title">
        <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
          Click me - I'm collapsible!
        </a>
      </h4>
    </div>
    <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
      <h4>Content for question 2</h4>
    </div>
  </div>
  <div class="panel panel-default">
    <div class="panel-heading" role="tab" id="headingThree">
      <h4 class="panel-title">
        <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
          Click me - I'm collapsible!
        </a>
      </h4>
    </div>
    <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
     <h4> Content for question 3</h4>
    </div>
  </div>
</div>
collapse1.JPG

collapse1.JPG (34.54 KiB) Viewed 854 times

Just amend the text and css to suit

Got it from Here

Active Member
Online

Posts

Joined
Sun Sep 27, 2015 1:10 am
Who is online

Users browsing this forum: No registered users and 12 guests