I am trying to place the logo in the middle of my navigation.
<f:section name="MainNavigation">
<f:if condition="{menu}">
<ul class="navbar-nav">
<f:for each="{menu}" as="item">
<f:if condition="{item.spacer}">
<f:then>
</ul>
<f:render section="MainNavigationLogo" arguments="{_all}" />
<ul class="navbar-nav">
</f:then>
<f:else>
The menu is splitting up, but the logo doesn't show up. I think it is because that {_all} does not contain the right information.
The MainNavigation is rendered this way
<f:render section="MainNavigation" arguments="{menu: mainnavigation, theme: theme}" />
How can I render af section inside another section in TYPO3?
There are no restriction to calls of sections in sections. But you need to provide the neccessary data.
As you wrote your prime section call just got two variables menu and theme, so other variables are not know inside the section, and could not be transfered any further.
You can test your set of variables by inserting this viewhelper call at different lines of your template:
<f:debug titel="identify this call">{_all}</f:debug>
Use the title attribute to provide a unique identifier of this debug code.
You might need to add another variable to your primary call so the infrmation also is available in your MainNavigationLogo section.
Related
the question I have might be hard to understand, so please help me re-organize the question if you can see the better way to put it in.
So, I am building a registration platform.
(1) First, I receive an array of objects of cases the user can sign time to.
(2) Each object consists of 2 properties, "name", "description".
(3) I store the array in the data, end use it in the element provided by a picker called "vue-multiselect", which basically accepts the array and loops over the objects and displays them.
(4) As you can see, it displays both properties and values, which I am trying to avoid. My question is, is it possible to pass only the "name" value into the picker, and display the description value when hovering the first value?
You can find this use case documentation here: https://vue-multiselect.js.org/#sub-custom-option-template
<multiselect v-model="value"
deselect-label=""
select-label=""
placeholder=""
selected-label=""
:show-pointer="true"
:options="projectCases">
<template slot="option" slot-scope="{ option }">
<strong :title="option.description">{{ option.name }}</strong>
</template>
</multiselect>
ps: I use title attribute to implement display-on-hover functionality. you can use any other tooltip library as well.
Currently custom fields show up as text on product pages.
Custom Field #1 Name: Material, Custom Field #1 Value: Cotton
Is there some other option instead to just pass data to the template? For example I'd like to display a 'NEW' label on the product page if new == true.
Sort of like https://springmerchant.com/bigcommerce/product-labels/
Right now we're using handlebars and if-statements to hide custom fields with a __prefix. For example __new: true.
If you're developing your template in stencil, there are a couple of options... You can loop through the custom fields until you find the correct one and then check the value... Ex:
{{#each product.custom_fields}}
{{#if name "==" "__new"}}
{{#if value "==" "true"}}
YOUR HTML CODE HERE
{{/if}}
{{/if}}
{{/each}}
Alternatively, you can put all your custom_fields into an array and use javascript to populate various aspects of the site:
<script>
var custom = [];
{{#each product.custom_fields}}
custom.push({'name':"{{name}}",'value':"{{value}}"});
{{/each}}
YOUR CODE TO LOOP THROUGH JSON ARRAY AND DO VARIOUS TESTS AND STUFF
</script>
If you don't have access to stencil templates and are just doing development through the control panel, you could write javascript to parse the default custom_field html and then use the data accordingly.
None of the solutions are particularly clean, but they all work.
We want to add custom fields that can be modified on the back end, yet also populate on the front end using custom fields. We have tried following, yet the fields didn't populate on the front end. See below for examples of the code and corresponding output:
Example Code
Result
How can we get these fields to properly populate on the front end?
I would start by reading the BigCommerce Stencil Documentation. The way you are calling the custom field values is not how they suggest calling these values.
The custom_fields are only accessible on the product detail page at this time in Stencil.
To display them on the product detail page, you can loop through each custom_field value with the following code.
{{#each product.custom_fields}}
<dt class="productView-info-name">{{name}}:</dt>
<dd class="productView-info-value">{{{value}}}</dd>
{{/each}}
You can check to see what values are available on each page by either reading the Stencil docs linked above, or debugging your page by removing the closing '/' and adding '?debug=bar' to the end of your localhost URL. Refresh your page and you will see all available store data in JSON format below the rendered page.
For more control over which custom field you output where you can create a reusable loop.
i.e. Create templates/components/products/custom-fields.html
{{#each product.custom_fields}}
{{#if name '===' ../custom_field}}
{{{value}}}
{{/if}}
{{/each}}
Then from your product_view.html you can specify the field value to output with a single line:
{{> components/products/custom-field custom_fields='custom field name'}}
Only the content of the div is unique. So, in the following dynamically generated html, only "My Article-1245" is unique:
<div class="col-md-4 article">
<h2>
My Article-1245
Delete
Edit
</h2>
<p>O ephemeral text! Here today, gone tomorrow. Not terribly important, but necessary</p>
</div>
How do I select the edit/delete link of this specific div, using Selenium? assertText/verifyText requires an element locator, but I do not have any unique id/name (out of my control). There will be many such div blocks, with other content text, all dynamically generated.
Any help would be appreciated.
If text 'My Article' appears each time, you may use following:
//For Delete
driver.findElement(By.xpath("//h2[contains(text(),'My Article-')]/a[text()='Delete']"));
//For Edit
driver.findElement(By.xpath("//h2[contains(text(),'My Article-')]/a[text()='Edit']"));
Hope it meets your requirement :)
Matching by text is always a bad automated testing concept. If you want to keep clean and reliable test scripts, then :
Contact your web dev to add unique identifiers to the elements
Suck it up, and create selectors based on what's there.
You are able to create a CSS selector based on what you want.
What you should do is create the selector using parent-child relationships:
driver.findElement(By.cssSelector("div.article:nth-child(X) a[href^='delete']"));
As I am ignorant of your appp, this is also assuming that all of your article classes are under the same parent. You would substitute X with the number of the div you want to refer to. e.g.:
<div id="someparent">
<div class="...article" />
<div class="...article" />
...
</div>
I am doing something wrong, that much I know. :) I am trying to display a simple breadcrumb on a page. I have this in a view:
#if (ViewContext.RouteData.Values["Action"].ToString() == "Index")
{
<li>
// This displays "Matter"
#ViewContext.RouteData.Values["Controller"]
</li>
}
else
{
<li>
// This displays a hyperlink "Matter",
// but the Href goes to "MyApp/Matter/Matter"
<a href="#ViewContext.RouteData.Values["Controller"].ToString()">
#ViewContext.RouteData.Values["Controller"]
</a>
</li>
}
In the above scenario, I have my Route.cs file set up to be "MyApp/Matter" which corresponds to an "Index" action on my "MatterController".
Clicking the link brings you to "MyApp/Matter/Matter" which does not work.
Any thoughts on how I can get this to work?
You're setting a relative path in the anchor tag. It's evaluating to:
Matter
That (Matter) gets appended to your current URL which, in this case, I can only assume is "MyApp/Matter". The result is "MyApp/Matter/Matter".
You need to specify an absolute URL or a more complete relative URL -- ../Matter would work in this case.
Beyond that, I can't help you without understanding a little more about what you're trying to do.
Where do you want the breadcrumb to take them? What's in the breadcrumb in relation to what they're looking at?
Is MyApp in your example the directory that contains the app or is it an area within your application?
I can only gather that Matter is the controller, but what's the action? If you're getting a link displayed then it's not currently looking at the Index action.