Forums

Styling the pagination

Permalink
I'm trying to style the pagination, but I'm having a problem with the because anything that's not "Previous", "Next", or "Current" doesn't have a style on it?

<span class="pageLeft">
<span class="currentPage">
<span class="">
<span class="pageRight">


I went into the pagination helper file to look, but not sure if I should override the helper or if there's a simpler way (i.e. calling a public method) to set this...?
 
jbx replied on at Permalink Reply
jbx
Well based on that code (and assuming it's wrapped in a div with a class of'pagination' or similar) - I guess you could do:

div.pagination span {
  // styles here
}
div.pagination span.pageLeft,
div.pagination span.currentPage,
div.pagination span.pageRight {
  // cancel the above styles here
}


... and then set the individual styles.

Would that work for you?

Jon
nicolechung replied on at Permalink Reply
Hm that's what I tried but the next and prev are double wrapped in <span> tags, like

<span class="pageRight><span class="something else"></span></span>


Meaning...hm I thought it was a css issue, but the php that generates the pagination is generating *slightly* hard to style markup and I'm not sure how to approach this? Do I hack the helper class, override the helper class, which way do I go??
jbx replied on at Permalink Best Answer Reply
jbx
I would create a new helper:

class MyPaginationHelper extends PaginationHelper {
  public function getNext($linkText = false) {
    // add your code here
  }
}


This way you can override just the functions you want to change. Then just call your helper instead of the main one...

Jon
nicolechung replied on at Permalink Reply
Erhm, okay I have more questions. That pagination instance is actually inside of the "ProductList" block in the ecommerce addon.

core_commerce/blocks/product_list/view.php

$paginator = $productList->getPagination();


getPagination appears to be coming from the base class (Item_List);

So if I override by making a MyPaginationHelper class, is there a way to hook my custom class into the Item_List core class?

Seems like that might be too complicated.
nicolechung replied on at Permalink Reply
Oh wait, I re-read the override how-to. It's just "Site" instead of "My" and changing the reset method:

class SitePaginationHelper extends PaginationHelper {
   public $classOn='page';
   public function reset() {
      $this->current_page=0;   //Zero Based
      $this->page_size=20;
      $this->result_offset=0;
      $this->number_of_pages=0;
      $this->result_count=0;
      $this->result_lower=0; //for 'Results lower-upper of result_count'
      $this->result_upper=0;
      $this->classOff='ltgray';
      $this->classOn='page';
      $this->classCurrent='currentPage';      
      $this->URL   ='';
      $this->jsFunctionCall='';
Viewing 15 lines of 19 lines. View entire code block.