dropdown menu link to specifict section in a page - menu

I have index.html and the catalog.html, in this page I have some Id in order to move throw diferents sections in that page.
I have a menu, with Hone and Catalog, this option it´s a dropdownmenu, so, what I need is if I´m index and clic on catalog can go to specific section (named "canal-prisma") of cataglo page, I have this code but didn´t work, thank you for your help
<li class="dropdown">
Catálogo<span class="caret"></span>
<ul class="dropdown-menu">
<li>CANAL PRISMA</li>
</ul>

Are you trying to go to a section on the page with the id or name attribute set as canal-prisma? If you set the id attribute, you should change that to the "name" attribute. Otherwise, more code is really needed to determine the answer to your question.
For example, in order to create a section of the page called canal-prisma:
Go to the Canal Prisma section
And in catalog.html:
<a name="canal-prisma">#</a>

Related

Magento - Change links in header

I just started with magento. I try to replace the header links on the default page. I need to replace the text "My Cart" with the following font-awesome icon.
<i class="fas fa-shopping-cart"></i>
But I have no clue where I can change this, the documentation is complicated and not very beginner friendly.
I figured it out. You have to create your own design and assign it in the backend . Then you have to create the following folder structure if it does not exist yet.
\app\design\frontend\yourDesign\default\template\page\template
Now create a file called links.phtml with the following content:
<ul class="links"<?php if($this->getName()): ?> id="<?php echo $this->getName() ?>"<?php endif;?>>
//insert links here
</ul>

How Can i add the customized section to home page in broadleaf

Hi I am new to broadleaf and i want to add the customized products to home page of broadleaf like the home page will load two cateogries of products at at time for example the home will want to load top sale products and hot sauces.
Please help me to Solve the issue.
Thanks in Advance
First off, i am not that experienced with broadleaf either, but my background has made it pretty easy for me to wrap my head around ( i think), and there are a quite a few different ways to do this and it really depends on how you ultimately like to maintain the lists, and your experience level.
As you have said you are just getting started, i'll give you what i think is the most simple way to do this.
First, assuming you are working from a recent version of the demo site. In this case, the home page is actually just a category with a custom template. If you look in the Admin app at the "Home" category and select the "Products" tab, you will see a list of the 4 Hot Sauces that are displayed on the home page in the Demo store.
The important thing to note here is that it is specifically not the "Hot Sauces" category, it is a specific subset that is selected in the admin app, giving you control of the not only the items displayed but the number of items displayed.
If you have seen the code in the homepage html template, you will see something like:
<div class="row">
<h3 class="text-center">
The Heat Clinic's Top Selling Sauces
</h3>
<th:block th:if="${products}" id="products" class="group" th:each="product : ${products}" th:object="${product}" >
<div class="col-sm-6 col-md-3" th:if="${product.isActive()}"
th:include="catalog/partials/productListItem">
</div>
</th:block>
</div>
This is the code in the demo site that is displaying the list of hot sauces on the home page. The CategoryController retrieved ths list of products for the category and put them in the Model.
Now, the absoloute easiest way to add a second list of products to the home page is use the same technique. In Admin look at the "Marketing" tab, you will see the same list of 4 products in the "Featured Products" section. As far as I am aware this is not actually being used in the new versions of the demo site. Note that there is also the upsell and xsell product lists, but for this purpose i am just going to use the Featured Products list. I suggest you change these to some other products now just so you can see the changes to the home page are pulling the correct list later.
In homepage.html insert something like the following code (it's similar to the code you looked at above):
<div class="row">
<h3 class="text-center">Top Selling Products</h3>
<th:block th:if="${category?.featuredProducts}" id="featuredProducts" class="group" th:each="featuredProduct : ${category.featuredProducts}">
<div class="col-sm-6 col-md-3" th:with="product=${featuredProduct.product}" th:object="${featuredProduct.product}"
th:include="catalog/partials/productListItem">
</div>
</th:block>
</div>
And your done.
This is certainly not the only way, or even the best way, unless your definition of best is "It takes 5 minutes and 6 lines of HTML".
At some point, depending on how your requirements pan out, you may end up creating a specific HomepageController, this approach should still work in that case, without customising the admin interface, as long as the data is still put in the model by the controller.
FYI: The homepage template is located at site/src/main/resources/webTemplates/layout/homepage.html

Kentico 9 Hierarchical transformations for a menu system

My end goal is to have a page that displays a Heading then links.
The Heading text would come from child folder, and the links would be pages within that folder.
I'm not concerned about the actual HTML at this point, but say an h2 for the header, an LI for each link.
I had thought i could create a repeater with a transformation to grab the folder name, and then all the sub nodes, but i'm struggling here since I've never tackled something like this in Kentico before, and have never attempted to build a navigation system using hierarchical transformations.
Here's my current content tree
Missed Payments
Group
Arrears Overview
Arrears Deductions
Flex
When rendered, Missed Payments should have the following code. When i add mew pages to Group and Flex, page links are shown
<h2>Group</h2>
<ul>
<li><a href='link to overview'></a>Page Name</li>
<li><a href='link to deductions'></a>Page Name</li>
</ul>
<h2>Flex First</h2>
I have a Header, Item and Footer transformation types, with Header, Link and Footer transformation. The HTML is simple, but i'm missing the piece to bring it all together.
Have you looked at the Creating a Mega Menu using Hierarchical transformations how to on Kentico?
For your level 0 header have <ul><li>
Level 1 header have
<ul>
<li><h2>{% Documents[NodeAliasPath].Parent.DocumentName #%}</h2></li>
<li>
All levels item: <a href="{% Transformation.GetDocumentUrl() #%}" >{%DocumentName%}</a>
All level separator: </li><li>
Footer: </li><li>
Make sure transformation type is Text/XML

Kentico Repeater Selected Item Transformation

I'm having an issues with two repeaters, both using the same Selected Item Transformation. Each repeater is fed by a separate Page Data Source, since i also have pagination.
When an item from repeater 1 is selected, i see the memo data, but also repeater 1 table header, and all of repeater 2's table. Is it possible to set up a new page template for this, and have the memo detail show there?
Here is the memo landing page:
And here is the detail page:
Here's the tranformation code:
<section id="memoDetail">
<h1>Memorandum</h1>
<ul id="memoHeader">
<li><span class="headerLabel">To:</span> {% To %}</li>
<li><span class="headerLabel">From:</span> {% From %}</li>
<li><span class="headerLabel">Subject:</span> {% Subject %}</li>
<li><span class="headerLabel">Date:</span> {% Date %}</li>
</ul>
<div id="memoDetails">{% Details %}</div>
</section>
I believe you're using the same page template for items listing as well as details pages. The answer is yes, you can have different templates for those pages. You'll have to update each page shown in the repeater with new template in this case.
However this is not necessary: you may try to hide second repeater, e.g. base on page type, if repeaters show pages of different type, or put some visibility macro there.
I'm not sure why does header shows up on the second screenshot - there should be something wrong with repeater setting.
Mark, there is a way to force all the content for a page type to be display using a dedicated template. Go to Page Types app > select the page type > General > New page settings > Default page template, and set it there. This way, it doesn't matter where the items are listed by whatever repeaters, they will be displayed with the same template.

Fancybox integrated into a minislide link

We have a row of header menu links where a couple of them need to be fancybox popups. However, when I insert the appropriate fancybox code into the menu section the text is slightly smaller and higher than the other links (and does not incorporate the minislide background button etc.):
<li><a id="tip6"><strong>How it works</a></li> <li class="line">|</li>
I realised for the text to appear correct it needs to have an actual href= link so the menu system knows it's a link (which it doesn't need to be). So of course when a link is added it overrides the fancybox operation. This is what a functional link needs to be formulated as in our menu system:
<li><strong>How it works</strong></li> <li class="line">|</li>
I want it to function as a fancybox link though, so how can I remove the actual href= link and fool the menu into thinking it's a link so it's correctly displayed?
I've already tried the following, without success:
<li><strong><a id="tip4" href="link.php">How it works</a></strong></li> <li class="line">|</li>
You could also use href="javascript:;" to avoid overriding the fancybox functionality and still having the href attribute to work with your style settings so
<li><strong><a id="tip4" href="javascript:;">How it works</a></strong></li> <li class="line">|</li>
or with the strong tag inside the anchor (doesn't really matter)
<li><a id="tip4" href="javascript:;"><strong>How it works</strong></a></li> <li class="line">|</li>
On the other hand, if you are planning to use the same script for more than one element within the same html document, the better use classes instead of ID. Check http://fancybox.net/faq No. 7 for more

Resources