I am editing product template on my Bigcommerce website and i am stuck at related products section.
Panel called "SideProductRelated.html" (inside Panels directory) is in charge for that section but the items themselves are being pulled by "%%SNIPPET_SideProductsRelated%%".
Aka, the code looks like this:
<div class="Block SideRelatedProducts Moveable Panel" style="display:%%GLOBAL_HideRelatedProductsPanel%%" id="SideProductRelated">
<h2>%%LNG_RelatedProducts%%</h2>
<div class="BlockContent">
<ul class="ProductList">
%%SNIPPET_SideProductsRelated%% <-- this is calling the items
</ul>
</div>
</div>
But, i searched and searched, and i cant find that snippet anywhere...
Anybody knows where that little dude hidden himself?
Thanks!
Even though the Panel SideProductRelated calls for %%SNIPPET_SideProductsRelated%%, you are looking for the SideRelatedProducts snippet which would be found in Snippets/SideRelatedProducts.html.
Related
I use the slick carousel on a regular basis and today I am experiencing an issue thats making me feel like I'm going insane.
When I apply the .slick() method to the parent element all the slides appear to the left of the page, the page extends horizontially by a lot and then when you attempt to slide it just jumps all over the place.
I have created a codepen to show the issue I'm having which you can see here https://codepen.io/harrietmcmahon/pen/pLWMbX?editors=1111
I've got
<div class="js--sc">
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
<div class="box"></div>
</div>
Applying .slick to js--sc
I've tried this with additional settings and without, I even tried just copying another codepen where it works, and it broke on that too!
Would really appreciate if someone could point out what I'm missing, or if anyone has experienced this issue?
Thank you
You just need to include the Slick CSS
https://cdn.jsdelivr.net/gh/kenwheeler/slick#1.8.1/slick/slick.css
https://cdn.jsdelivr.net/gh/kenwheeler/slick#1.8.1/slick/slick-theme.css
I am working on a legacy application that is being rewritten using Aurelia, the application has a bunch of static html in a tblHelp that needs to be displayed. I am using innerhtml.bind on a div in my view to databind the stored static HTML into the view. Each record is essentially a document complete with a full table of contents that links to other divs within the document (Bookmarks).
Something like:
<div id="toc">
<h1>Table of Contents</h1>
<ul>
<li>Section 1<li>
<li>Section 2<li>
</ul>
</div>
<div id="section1">
<h2>Section 1</h2>
<p>Paragraph Text...</p>
<p>Back to Table of Contents</p>
</div>
<div id="section2">
<h2>Section 2</h2>
<p>Paragraph Text...</p>
<p>Back to Table of Contents</p>
</div>
When I display the resulting page in my Aurelia view and click on the links, rather than moving to the proper Div on the current page, it seems to be attempting to route to an unknown route and ends up returning to the home page (that is my unknown route behavior). How do I make the Aurelia Router know that I am just moving around the same page and do not require it to route to another page?
I think you need to change your <div id= to <a id= which is the correct syntax for anchors. Hopefully Aurelia will recognize them as legitimate anchors when formatted correctly.
Also, since an anchor tag shouldn't wrap the whole content, you'll just open and close it at the top of the div. You can even leave the divs there but should not duplicate the id.
Update:
That being said, I created a GistRun that actually demonstrates that Aurelia should be able to handle the <div id= anchor targets. So, I'm not exactly sure why you're having problems.
Maybe this GistRun or the more standard <a id= approach will help you.
Is there an easy durandal way to clear the view and put a loading or please wait... on the screen so the user gets some feedback to know that it is working until the ajax content loads?
Right now when I click on a something that navigates to a child route and that child route loads a module that has to do a lot of stuff in activate(), it does not switch the nav or clear the screen or give any feedback to the user that it is working and I see them clicking many times over and over and getting frustrated, then just about when they want to give up, the page loads in fine.
I would like to make this default functionality for my app and not have to do something special in every module or on every page, is that possible?
Thanks.
Have you tried to use router.isNavigating? Original Durandal template contains a spinner like this:
<div class="loader pull-right" data-bind="css: { active: router.isNavigating }">
<i class="icon-spinner icon-2x icon-spin"></i>
</div>
A large percentage of the time, what you're looking for can be obtained very simply via:
<div data-bind="compose:ActiveVm">
<div class="text-center" style="margin : 75px">
<i class="fa fa-spinner fa-spin"></i>
</div>
</div>
The inner div can be any arbitrary markup which will display while the viewmodel is going through activation.
Note that this currently only displays the placeholder content the first time this dom section is composed. If you have a section of your application which is being updated via an observable viewmodel + compose approach, you could use the approach here:
Durandal: Showing a 'LOADING...' during composition
For anyone visiting from the future, this issue might be worth checking out in case native support for this is desired:
https://github.com/BlueSpire/Durandal/issues/414
Bit of a weird problem that I'm finding inexplicable - would appreciate any assistance! Unfortunately I can't provide a link to the development site in question, as I don't have permission to release the password, so I'll try to describe the issue in as much detail as possible.
Basically, I have a Superfish menu set up using the standard structure, abridged code as follows:
<ul class="sf-menu top-level">
<li class="level-1"><a class="level-1" href="/menu/">Menu Title</a>
<ul>
<li class="level-2"><a class="level-2" href="/sub-menu/">Sub-Menu Link</a></li>
<li class="level-2"><a class="level-2" href="/sub-menu/">Sub-Menu Link</a></li>
</ul>
</li>
<li class="level-1"><a class="level-1" href="/link/">Link Title</a></li>
<li class="level-1"><a class="level-1" href="/link/">Link Title</a></li>
</ul>
Menu is all working correctly as it should. However, the sfHover class - in addition to being applied to li's with child ul elements - is also being applied to li's WITHOUT child ul on click, which is resulting in styling being applied to these items without sub-menus that I don't want. I've checked the demo version of Superfish, and this anomaly also applies, so it seems to be a 'bug' with the default code, but I can't figure out how to fix it.
http://users.tpg.com.au/j_birch/plugins/superfish/#examples
Basically, I want sfHover (i.e. the class defined in sfDefaults as hoverClass) to be applied only to the items that actually have sub-menus. This is working correctly on hover, but on click applies the class across the board, which looks really weird for a split second before the new page loads in my case, as the styling applied to sfHover is very obviously only designed for items that have some sub-menu content.
I really hope that made sense, and would be incredibly grateful for anyone who can shed some light on this or suggest a workaround, as I'm tearing my hair out!
I'm wondering if there is an alternative for dijit.form.DropDownButton when it comes to the usage of TooltipDialog. On dojo guide reference it says "TooltipDialog can only be opened by other widget, usually DropDownButton", but I don't want that.
What I really want, and maybe a lot of people, is declarative way to call the dialog clicking on an image/link/or whatever, not only buttons. It's something like the Tooltip widget does with connectId.
See a sample what I am looking for:
<div dojoType="MyWidget">
<img src="test.png" /><!-- this image will be clickable to open dialog -->
<div dojoType="dijit.TooltipDialog">Text here</div>
</div>
Any thoughts?
Thanks!
You could extend the dijit.form.DropDownButton and provide a html template that is just the image.