• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
Locked
0

Individual Product Page CSS Issue

Community Beginner ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

I am having an interesting problem..  I recently updated the template for my clients BC e-commerce store. Every page has been skinned, except for the lower level pages, such as the individual product pages. The catalogs display correctly, but as soon as an item is chosen the next page seems to be having trouble finding the CSS. This happens with the store and the blog. If you click on an individual story on the blog to see its specific page it is having the same CSS issue.

I have tried everything I can think of. This is also my first time using BC for this type of build. All I did was follow what had been done originally.

Any help would be appreciated and links will be included below.

Main Page http://www.sunkingbrewing.com/apparel

Individual Product http://www.sunkingbrewing.com/apparel/bagofmystery

Main Page http://www.sunkingbrewing.com/blog

Individual Post http://www.sunkingbrewing.com/blog/what-do-you-do-with-all-of-that-halloween-candy

TOPICS
Content management and modules , eCommerce

Views

15.5K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

Here are a few things to check on.

What's in your Module Templates for Blog Detail Layout? In the Manage tab, go to Module Templates > Blog Layouts > Blog Post Details Layout.

What's in your Module Templates for Products Overall? In the Manage tab, go to Module Templates > Online Shop Layouts > Overall Layout.

What's in your Module Templates for Individual Product Large? In the Manage tab, go to Module Templates > Online Shop Layouts > Individual Product - Large.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

Individual Large Code:

<div class="shop-product-large clear">

    <div class="details">

        <h1>{tag_name}</h1>

        <ul>

            <li class="price"><strong>{tag_saleprice}</strong> </li>

            <li class="price"><strong>FREE SHIPPING ON ALL ORDERS</strong> </li>

            <li class="price"><strong>Please allow <strong><p style="display: inline !important;">2-3 business days for order processing, and 3-10 business days for shipping, depending on order destination.</p></strong>

                <br /> </strong>

            </li>

            <li class="price"><strong><ul style="display: inline !important;"><li style="display: inline !important;"><strong>{tag_attributes}</strong> </li>

        </ul>

        </strong>

        </li>

        <li class="quantity">{tag_addtocartinputfield} {tag_addtocart,<img src="/CatalystImages/shop_addtocart.png">}</li>

        </ul>

        <div class="description">{tag_description}</div>

    </div>

    <div class="image"> {tag_largeimage}

        <div class="poplets">{tag_poplets}</div>

    </div>

</div>

<div class="comment-form">

    <h5> </h5>

    <form name="catratingform2343" onsubmit="return checkWholeForm2343(this)" method="post" action="/RatingProcess.aspx?OID={module_oid}&OTYPE={module_otype}">

        <div class="form"> </div>

        <script type="text/javascript" src="/CatalystScripts/ValidationFunctions.js"></script>

        <script type="text/javascript">

            //<![CDATA[

            function checkWholeForm2343(theForm) {

                    var why = "";

                    if (theForm.EmailAddress)

                        if (theForm.EmailAddress.value.length > 0) why += checkEmail(theForm.EmailAddress.value);

                    if (theForm.CaptchaV2) why += isEmpty(theForm.CaptchaV2.value, "Enter Word Verification in box below");

                    if (why != "") {

                        alert(why);

                        return false;

                    }

                    theForm.submit();

                    return false;

                }

                //]]>

        </script>

    </form>

</div>

Blog Detail Code:

<div class="blog-post">

<h2 class="post-title"> {tag_blogposttitle_nolink} </h2>

<div class="post-details">{tag_blogpostdate} </div>

<div class="post-body"> {tag_blogpostbody}</div>

<div class="post-body">  <br />

</div>

<div class="post-body">

<div class="links"> <a href="#comments">Comments ({tag_commentcount})</a> | <a href="#trackbacks">Trackbacks ({tag_trackbackcount})</a> | {tag_permalink}</div>

| <a href="https://twitter.com/share" class="twitter-share-button" data-via="sunkingbrewing">Tweet</a>

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

<div class="links"><br />

</div>

</div>

<!-- BEGIN #comments -->

<a name="comments"></a>

<div class="comment-list">

<h5> Comments</h5>

{tag_commentspaged}

<hr />

<form onsubmit="return checkWholeForm(this)" action="/RatingProcess.aspx?OID={tag_blogpostid}&OTYPE={tag_blogposttype}" method="post">

    <h5> Post a Comment</h5>

    <div class="form">

    <div class="item">

    <label> Name (optional)</label>

    <br />

    <input maxlength="255" name="fullname" class="cat_textbox_small" />

    </div>

    <div class="item">

    <label> Website (optional)</label>

    <br />

    <input maxlength="255" name="website" class="cat_textbox_small" />

    </div>

    <div class="item">

    <label> Email Address (optional)</label>

    <br />

    <input maxlength="255" name="emailaddress" class="cat_textbox_small" />

    </div>

    <div class="item">

    <label> Enter Word Verification in box below</label>

    <br />

    {module_captchav2}

    </div>

    <div class="item">

    <label> Your comment</label>

    <br />

    <textarea name="Feedback" class="cat_listbox_small"></textarea>

    </div>

    <div class="item">

    <input type="submit" value="Submit" />

    </div>

    </div>

    <script type="text/javascript" src="/CatalystScripts/ValidationFunctions.js"></script>

    <script type="text/javascript">

      //<![CDATA[

      function checkWholeForm(theForm) {

        var why = "";

        if (theForm.EmailAddress) if (theForm.EmailAddress.value.length > 0) why += checkEmail(theForm.EmailAddress.value);

        if (theForm.CaptchaV2) why += isEmpty(theForm.CaptchaV2.value, "Enter Word Verification in box below");

        if (why != "") { alert(why); return false; }

        return true;

      }

      //]]>

      </script>

</form>

</div>

<!-- END #comments -->

<!-- BEGIN #trackbacks -->

<a name="trackbacks"></a>

<div class="trackbacks">

<dl>

    <dt>Trackback Link</dt>

    <dd> {tag_trackbacklink}</dd>

    <dt>Trackbacks</dt>

    <dd> {tag_trackbacklist}</dd>

</dl>

</div>

<!-- END #trackbacks -->

</div>

<!-- END .blog-post -->

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

When you go to Modules > Blogs > [Name of blog, if you have more than one.] > Blog Details , is the correct page template selected?

screenshot.jpg

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

Yes. If you look at the source code in your browser all the correct code is in place. But for some odd reason, it won't pull the CSS from the template.

Capture.JPG

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

Ignore all of the above.

With BC. Any time you have a file be it image, JS or CSS for example you need to have a forward slash at the start to tell BC to read from the root.

You have:

<link rel="stylesheet" type="text/css" href="css/site_global.css?crc=4016592342" />

BC will try and find a file for that inside the catalogue you are in (folder).

You need to do it like this:

<link rel="stylesheet" type="text/css" href="/css/site_global.css?crc=4016592342" />

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

I had read something similar to this, but every time I have changed that it makes the page go completely blank. Which leaves me even more confused as to where the error is occurring.

I left it up so you can see it and make sure I am not making another error.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

But why is it working on one page, and not on the other? This thread is its own Bag of Mystery!

I tried building my own version of the page, using absolute urls to the page assets. Just as the OP described, everything vanished.

I'm seeing this error on http://www.sunkingbrewing.com/apparel/bagofmystery :

Capture.PNG

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

BC does not produce that error. You have code in your site that does that from Muse.

Muse is a mess, for me I think it is one of the worst peaces of software I have seen, especially in terms of trying to make websites.


The code on that site is a mess for me, scripting and errors all over the place.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Nov 08, 2017 Nov 08, 2017

Copy link to clipboard

Copied

LATEST

I ended up speaking with support for Adobe Bc. My whole problem was that I was not exporting the site directly from Muse to Bc. Instead, I was exporting and copying over using an FTP client

Thanks for your attempts at helping me!

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines