Custom css for links in pagination script

Place for comments, problems, questions, or any issue related to the JavaScript / PHP scripts from this site.
mlucicom
Posts: 37

Custom css for links in pagination script

On this page: mluci.website/rent i use your pagination script from: https://coursesweb.net/php-mysql/paginat ... -script_s2
It' very good, but i want to use my custom css for this pagination script and don't know how to integrate this.

Code: Select all

//...
  // method that sets the links
  public function getLinks() {
  $re_links = '';         // the variable that will contein the links and will be returned
  $pag_get = '?pg=';      // the name for the GET value added in URL

  // if $totalpages>0 and totalpages higher then $this->idpage
  if($this->totalpages > 0 && $this->totalpages > $this->idpage) {
    // links to first and back page, if it isn't the first page
    if ($this->idpage > 0) {
      // show << for link to 1st page
      if(($this->idpage + 1) > $this->range) $re_links .= '<a href="'. $this->pag. '" title="1">(1) <<</a>';  

      // show < for link to back page
      if(($this->idpage - $this->range) > 2) $re_links .= ' <a href="'. $this->pag. $pag_get. ($this->idpage - $this->range - 1) .'" title="'. ($this->idpage - $this->range) .'">('. ($this->idpage - $this->range) .')<</a>';
    }

    // sets the links in the range of the current page
    for($x = ($this->idpage - $this->range + 1); $x <= ($this->idpage + $this->range); $x++) {
      $ipg = max(0, ($x - 1));       // index of page in URL
      // if it's a number between 0 and last page
      if (($x > 0) && ($x <= $this->totalpages)) {
        // if it's the number of current page, show the number without link, otherwise add link
        if ($x == ($this->idpage + 1)) $re_links .= ' [<span style="    white-space: nowrap;
    font-size: 11px;
    line-height: 33px;
    font-weight: 700;
    text-transform: uppercase;
    text-align: center;
    margin: 0 3px;
    float: left;
    width: 33px;
    height: 33px;
    background: #fff;
    -moz-border-radius: 17px;
    -webkit-border-radius: 17px;
    border-radius: 17px;
    webkit-box-shadow: 0 0 2px rgba(0,0,0,0.1);
    -moz-box-shadow: 0 0 2px rgba(0,0,0,0.1);
    box-shadow: 0 0 2px rgba(0,0,0,0.1);
}">'. $x .'</span>] ';
        else $re_links .= ' <a href="'. $this->pag. $pag_get. $ipg. '" title="'. $x. '">'. $x .'</a>';  
      }
    }

    // If the current page is not final, adds link to next and last page
    if ($this->idpage < $this->totalpages) {
      // show > for next page
      if(($this->idpage + $this->range) < ($this->totalpages - 3)) $re_links .= ' <a href="'. $this->pag. $pag_get. ($this->idpage + $this->range + 1) .'" title="'. ($this->idpage + $this->range +2) .'">>('. ($this->idpage + $this->range +2) .')</a>';
      //  show >> for last page
      if($this->totalpages > $this->range && $this->totalpages > ($this->idpage + 2)) $re_links .= ' <a href="'. $this->pag. $pag_get. ($this->totalpages - 1) .'" title="'. $this->totalpages .'">>> ('. $this->totalpages. ')</a> ';
    }
  }

    // adds all links into a DIV and return it
    if(strlen($re_links)>1) $re_links = $re_links;
    return $re_links;
  }
}
and this is the pagination that i want to use

Code: Select all

<div class="pager">
					<span><a href="index.html">First page</a></span><span class='page-numbers current'>1</span><span><a class='page-numbers' href='page/2/index.html'>2</a></span><span><a class='page-numbers' href='page/3/index.html'>3</a></span><span><a class='page-numbers' href='page/4/index.html'>4</a></span><span><a class="next page-numbers" href="page/2/index.html">></a></span><span><a href="page/4/index.html">Last page</a></span>				</div>
			</nav>
				</div>

Admin Posts: 805
Hello,
See if this it works. In that pagination class replace the getLinks() method with this:

Code: Select all

// method that sets the links
public function getLinks(){
  $re_links ='';         // the variable that will contein the links and will be returned
  $pag_get ='?pg=';      // the name for the GET value added in URL

  // if $totalpages>0 and totalpages higher then $this->idpage
  if($this->totalpages >0 && $this->totalpages > $this->idpage) {
    // links to first and back page, if it isn't the first page
    if ($this->idpage >0){
      // show << for link to 1st page
      if(($this->idpage +1) > $this->range) $re_links .='<span><a href="'. $this->pag. '" title="1">First page</a></span>'; 

      // show < for link to back page
      if(($this->idpage - $this->range) >2) $re_links .=' <span class="prev page-numbers"><a href="'. $this->pag. $pag_get. ($this->idpage - $this->range -1) .'" title="'. ($this->idpage - $this->range) .'">('. ($this->idpage - $this->range) .')<</a></span>';
    }

    // sets the links in the range of the current page
    for($x = ($this->idpage - $this->range +1); $x <= ($this->idpage + $this->range); $x++){
      $ipg = max(0, ($x -1));       // index of page in URL
      // if it's a number between 0 and last page
      if(($x >0) && ($x <= $this->totalpages)){
        // if it's the number of current page, show the number without link, otherwise add link
        if($x == ($this->idpage +1)) $re_links .=' <span class="current page-numbers">'. $x .'</span> ';
        else $re_links .=' <span class="page-numbers"><a href="'. $this->pag. $pag_get. $ipg. '" title="'. $x. '">'. $x .'</a></span>'; 
      }
    }

    // If the current page is not final, adds link to next and last page
    if($this->idpage < $this->totalpages){
      // show > for next page
      if(($this->idpage + $this->range) < ($this->totalpages -3)) $re_links .=' <span class="next page-numbers"><a href="'. $this->pag. $pag_get. ($this->idpage + $this->range +1) .'" title="'. ($this->idpage + $this->range +2) .'">>('. ($this->idpage + $this->range +2) .')</a></span>';
      //  show >> for last page
      if($this->totalpages > $this->range && $this->totalpages > ($this->idpage + 2)) $re_links .=' <span><a href="'. $this->pag. $pag_get. ($this->totalpages - 1) .'" title="'. $this->totalpages .'">Last page ('. $this->totalpages. ')</a></span> ';
    }
  }

  // adds all links into a DIV and return it
  if(strlen($re_links)>1) $re_links ='<div class="pager">'. $re_links .'</div>';
  return $re_links;
}
Then style the css classes in your custom css.

mlucicom Posts: 37
how can i display pagination where i want?

Admin Posts: 805
Did you read the documentation?
- Display paginated content:

Code: Select all

echo $objPg->getMysqlRows();
- Display pagination links:

Code: Select all

echo $objPg->getLinks();

mlucicom Posts: 37
thank you! your code work great..but i have a problem..the first number page doesn't is a circle..how can i fix this

Admin Posts: 805
From what i saw in that page, all the pagination numbers are with circle style.
Anyway, the solution is to set the same css style as the other buttons, a same css class.