Assign an image file to a variable?

[cpp-dev]

I have a navigation set, that has default calls for things found on a Category listing. But a "plain" category wasn't working as we want to display several categories on the page, not just the products. This page is meant to show the groupings that are under a single brand, but not just splat all the products on the page.

The page is fine, and with a little guidance from Tech Support I modified the nav set template/iterator to render the page link in the navigation set.

But we also want to have an image with said link as to have it look like the other category listings.

I assume it possible to assign an image file to a variable. I have tried this, and it lives in the template of the page, but it doesn't seem to show the image.

<mvt:assign name="l.settings:navigationitem:category:cattree:i mage" value="graphics/00000001/logo-product-main.png" />

And for this is the nav item template

<section>
<!--<h2>Featured Categories</h2>-->
<div class="featured-categories">
<mvt:if expr="NOT ISNULL l.settings:readytheme:navigationitems">
<ul class="featured-categories__list no-list row">
<mvt:foreach iterator="navigationitem" array="readytheme:navigationitems">
<mvt:comment><mvt:if expr="l.settings:navigationitem:link_type NE 'C'">
<mvt:foreachcontinue />
</mvt:if></mvt:comment>

<mvt:do file="g.Module_Library_DB" name="l.success" value="Category_Load_Code( l.settings:navigationitem:link_dest, l.settings:navigationitem:category )" />
<mvt:do file="g.Module_Root $ '/modules/component/cmp-cssui-cattree.mvc'" name="l.settings:navigationitem:category:cattree_r esult" value="CSSUI_CatTree_Load( l.settings:navigationitem:category:id, l.settings:navigationitem:category:cattree )" />
<mvt:assign name="l.settings:navigationitem:link_href" value="gettoken( gettoken( l.settings:navigationitem:link, '\"', 2 ), '\"', 1 )" />
<mvt:assign name="l.settings:navigationitem:link" value="glosub( l.settings:navigationitem:link, ' href=', ' class=\"featured-categories__name\" href=' )" />
<li class="featured-categories__item column half medium-one-fifth align-center">
<mvt:if expr="l.settings:navigationitem:category:cattree:i mage">
<a href="&mvt:navigationitem:link_href;" class="featured-categories__image-link vertical-align-parent">
<img src="&mvt:navigationitem:category:cattree:image;" alt="&mvt:navigationitem:category:name;" class="featured-categories__image vertical-align">
</a>
</mvt:if>
&mvt:navigationitem:link;
</li>
</mvt:foreach>
</ul>
</mvt:if>
</div>
 </section>

[Kent Multer]

Hmmm, I don't have time to decode all this today, but I did notice an error in that first mvt:assign element. To assign a string value, you need to enclose it in single quotes, inside the double quotes, e.g.:

<mvt:assign name="l.settings:navigationitem:category:cattree:image" value="'graphics/00000001/logo-product-main.png'" />

Note the doulbe and single quotes before "graphics," and the single and double quotes after "png."

Your sample also had a space in the word "image," but I think that's probably a forum bug; it happens a lot when people paste code into their posts.

I don't claim that that will fix everything, but it's a good place to start.

HTH --

[cpp-dev]

Thanks for the tip Kent Multer . It didn't fix the issue, but it was a good reminder to check for some of those small mistakes.

I'm not seeing anything else odd at the moment, well other than the missing image.

[habreu]

I'm not sure if this is useful but Tool Belt is available for free on the Miva app store https://apps.miva.com/miva-toolbelt.html

It has a function which if I understood correctly may do what you want

Category_Images

This item loads the Category Title and Category Tree images into a user selected variable name.

<mvt:item name="ry_toolbelt" param="category_images|g.imgsrc|g.category_code" /> <mvt:item name="ry_toolbelt" param="category_images|g.imgsrc|l.all_settings:sub cat:code" />  

Example 1: Category Title image

<mvt:if expr="NOT ISNULL g.imgsrc:title">  <img src="&mvt:global:imgsrc:title;"> </mvt:if>  

Example 2: Category Tree image

<mvt:if expr="NOT ISNULL g.imgsrc:tree">  <img src="&mvt:global:imgsrc:tree;"> </mvt:if>

[cpp-dev]

Still muddling though.

I thought maybe something with 'mvt:do' like: (based on Miva Docs: Image_Load_File)

<mvt:do file="g.Module_Library_DB" name="l.settings:navigationitem:category:cattree:image" value="Image_Load_File('graphics/00000001/logo-bravecto-main.png')" />

then I try to call the entity and I don't see anything:

<div>
  <mvt:item name="content" />
  <div class="row">
    &mvte:local:settings:navigationitem:category:c attree:image;
  </div>
</div>

It seems like this is most likely candidate for working but it still feels out of reach.

[Gordon - Phosphor Media]

This may seem elementary, but do you have a base href defined in the head of that page?

[Bruce - PhosphorMedia]

[QUOTE=cpp-dev;n711687]Still muddling though.

I thought maybe something with 'mvt:do' like: (based on Miva Docs: Image_Load_File)

<mvt:do file="g.Module_Library_DB" name="l.settings:navigationitem:category:cattree:image" value="Image_Load_File('graphics/00000001/logo-bravecto-main.png')" />

Nah, that function call has nothing to do with what I think you are trying to accomplish and the function expects a variable specifying and image type (and surprised it compiled) a variable var to load resulting information.

I think you want to just use:

<mvt:do name="l.result" file="g.Module_Library_DB" value="Category_Load_Code(l.settings:navigationitem:link_dest, l.settings:thisCat)" />
<mvt:do name="l.result" file="g.Module_Library_DB" value="CategoryList_Load_Parent( l.settings:thisCat:id, l.settings:thisCatInfo)" />

&mvt:thisCatInfo:image;

Note: Not sure about "l.settings:navigationitem:link_dest" as containing the code cause i rarely use navigation sets, but its whatever variable contains the category code.

[cpp-dev]

This may seem elementary, but do you have a base href defined in the head of that page?

Sorry I don't quite follow. What do you mean by "base href"?

[cpp-dev]

Bruce - PhosphorMedia This looks really close. The thing that seems to be tripping this up is that thing I'm linking to is just a page. But I'm wanting the link and image to appear in a navigation set, which contains categories.

[Bruce - PhosphorMedia]

Bruce - PhosphorMedia This looks really close. The thing that seems to be tripping this up is that thing I'm linking to is just a page. But I'm wanting the link and image to appear in a navigation set, which contains categories.

Sorry, not following.

[cpp-dev]

I've been continuing to search the Miva API page and I saw this Miva Docs: ProductImage_Insert

seemed promising, but seem still not quite right:

<mvt:do file="g.Module_Library_DB" name="l.success " value="ProductImage_Insert('graphics/00000001/logo-bravecto-main.png' 'l.settings:navigationitem:category:catt ree:image')" />
  &mvte:local:settings:navigationitem:category:cattree:image;

[cpp-dev]

Sorry, not following.

Hmm. Maybe I can illustrate the idea more clearly

So navigation sets in the Levels theme are designed to work from Categories. Categories have specific fields, one of these is a field for an image. I pretty sure you know this, but included for completeness.
(see image)
miva-category-tree-img.png

The product brand has a several subcategories. But a category page doesn't display the sub categories is a meaningful way. Best I could figure was to have all the products be visible, which was a jumbled mess.

So I created a custom page, which has a single navigation set item, which displays the desired categories in a nice layout, and makes it simple for the user to move up and down the category tree. (see image)
crafted-category-page.png

All is well ... except that on the affiliate/partner page where we have a specific collection of categories for the partnered members, that is being displayed through a navigation set. With a little commenting of the template code we got the navigation set to show the link to page along with the categories. But it looks extra odd, because it doesn't have an image. (see image)
miva-category-navset-display.png
SO, the end goal is to create the variable that the template code expects, and have it point to a file on the server. Ideally the template code will read the variable and display the desired file.

If we can get this to work I'm planning on reusing this pattern in another navigation set.

[Gordon - Phosphor Media]

Sorry I don't quite follow. What do you mean by "base href"?

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base

[Bruce - PhosphorMedia]

Hmm. Maybe I can illustrate the idea more clearly

Yea, I think you are going to need to hire an integrator/developer to get this done as there are too many variables (and not in the coding sense) at play here to work out in a forum post. Sorry.

[Leanne]

I think the problem is that you're trying to load a category tree image for an element that is not actually a category, and therefore doesn't have a category tree image assigned to it. I would create an image to represent the brand, save it with the same name as your link (i.e. Bravecto.jpg) and put it in a dedicated folder on your server just for these types of pages. Run a conditional that checks for the page name in the link text, and if it matches, assign the /my-special-directory/my-page-name.jpg image to the variable that displays the category tree image. Or am i missing something bigger that means this wouldn't work?