Product catalog current page selection

Dmitrij Jazel

Posted on 28/08/2012 11:28:18

Hej DW guys,

I wanted to know how can I hook up current page of the product catalog to css.
If you take a look at this article here.
You will see that it should be possible mark current page and stile it with css.

When if I am trying to use this pager in the same way described in this article I can't seem to find the way to give current page a css selector so I could give it some stiling.

For example if I am viewing page #2, it is not marked. Cause there is no way I could select it in css.
See the attachment

In product catalog I am using this code here...

      <div class="alignRight">
      <a id="prevpage" class="pagePrevButtom2" href="<!--@Ecom:ProductList.PrevPage.Clean-->"></a>
      <span class="numberPager"><!--@LoopStart(Ecom:ProductList.Pages5)-->
    <!--DwTemplateTags-->
    <a href="<!--@Ecom:ProductList.Pages5.Page.Url-->"><!--@Ecom:ProductList.Pages5.Page.Number--></a>
    <!--@LoopEnd(Ecom:ProductList.Pages5)-->
      </span>
      <a id="nextpage" class="pageNextButtom2" href="<!--@Ecom:ProductList.NextPage.Clean-->"></a>
      <span class="pagerEnd">&nbsp;Side <!--@Ecom:ProductList.CurrentPage--> af <!--@Ecom:ProductList.TotalPages--></span>
    </div><!--/alignRight-->

Thanks for help in advance :-)

Regards,
Dmitrij

Replies

Marco Johannesen

Posted on 28/08/2012 11:36:21

Cant you just compare

<!--@Ecom:ProductList.CurrentPage-->

And




<!--@Ecom:ProductList.Pages5.Page.Number-->






and if they are the same, give it class="active" ...





<a href="<!--@Ecom:ProductList.Pages5.Page.Url-->" <!--@If(Ecom:ProductList.CurrentPage=Ecom:ProductList.Pages5.Page.Number)-->class="active"<!--@EndIf-->><!--@Ecom:ProductList.Pages5.Page.Number--></a>


Maybe you need to use the new GetMaster tag, for retriving the current page inside the loop..



But i might be wrong ;-)

Dmitrij Jazel

Posted on 28/08/2012 12:13:49

Hej Marco,

Thanks for quick response... and great tip :-)
Well I can't seem to find that "GetMaster" tag you are talking about, you have a good example here, I tried to use it, but it seams not to work, not sure why :-/

this is how I use it...:

<div class="alignRight">
      <a id="prevpage" class="pagePrevButtom2" href="<!--@Ecom:ProductList.PrevPage.Clean-->"></a>
      <span class="numberPager">
    <!--@LoopStart(Ecom:ProductList.Pages5)-->
        <a href="<!--@Ecom:ProductList.Pages5.Page.Url-->" <!--@If(Ecom:ProductList.CurrentPage=Ecom:ProductList.Pages5.Page.Number)-->class="active"<!--@EndIf-->><!--@Ecom:ProductList.Pages5.Page.Number--></a>
    <!--@LoopEnd(Ecom:ProductList.Pages5)-->
      </span>
      <a id="nextpage" class="pageNextButtom2" href="<!--@Ecom:ProductList.NextPage.Clean-->"></a>
      <span class="pagerEnd">&nbsp;Side <!--@Ecom:ProductList.CurrentPage--> af <!--@Ecom:ProductList.TotalPages--></span>
    </div><!--/alignRight-->

At the same time I could think of using comparing TAG to Boolean 'True' but I feel I have some kind of syntax problem here, most likely the condition in If statement. But it is text value from DW tags, and document returns strings, not sure what else can it be if not @(DWTAG='value')

What about this other example? Too bad can't get them to work :-/

      <div class="alignRight">
      <a id="prevpage" class="pagePrevButtom2" href="<!--@Ecom:ProductList.PrevPage.Clean-->"></a>
      <span class="numberPager"><!--@LoopStart(Ecom:ProductList.Pages5)-->
    <!--@DwTemplateTags-->
                <!--@If(Ecom:ProductList.Pages5.Page.IsCurrent ='True')-->
                <a class="currentPage" href="<!--@Ecom:ProductList.Pages5.Page.Url-->"><!--@Ecom:ProductList.Pages5.Page.Number--></a>
                <!--@EndIf-->
                <!--@If(Ecom:ProductList.Pages5.Page.IsCurrent !='True')-->
                <a class="" href="<!--@Ecom:ProductList.Pages5.Page.Url-->"><!--@Ecom:ProductList.Pages5.Page.Number--></a>
                <!--@EndIf-->
    <!--@LoopEnd(Ecom:ProductList.Pages5)-->
      </span>
      <a id="nextpage" class="pageNextButtom2" href="<!--@Ecom:ProductList.NextPage.Clean-->"></a>
      <span class="pagerEnd">&nbsp;Side <!--@Ecom:ProductList.CurrentPage--> af <!--@Ecom:ProductList.TotalPages--></span>
    </div><!--/alignRight-->

Marco Johannesen

Posted on 28/08/2012 12:56:50

This post has been marked as an answer

If you use it without the strings it works (i tested it on a DW8).
Like this:

    <!--@LoopStart(Ecom:ProductList.Pages)-->
        <!--@Ecom:ProductList.Pages.Page.Number-->
        <!--@If(Ecom:ProductList.Pages.Page.IsCurrent=True)-->Hello<!--@EndIf-->
    <!--@LoopEnd(Ecom:ProductList.Pages)-->

So you own version is actually pretty solid ;-)

Votes for this answer: 0

Dmitrij Jazel

Posted on 28/08/2012 13:23:05

Hej Again Marco,

But I can clearly see you are using Ecom:ProductList.Pages instead of Ecom:ProductList.Pages5
Hmm this is a bit odd, your example works, I am going to continue there on.

Still thanks alot for help! :-)

Regards,
Dmitrij

You must be logged in to post in the forum

Developer forum

Product catalog current page selection

Replies