Jump to content
jwbjnwolf

Adding features to a dynamic pagination script

Recommended Posts

Hi, I have a PHP array of all folders in a directory, and creating a list of divs from them all with a specified class.

I have this jQuery script (CodePen link) that just simply requires me to specify the class of what elements I want to paginate, as well as have a place holder element for the pager below. That works fine. No other things needed.

But as of right now, this is a very basic script where the pager numbers just keep adding up. What I want to add is the previous/next/first/last buttons as well as say a limit of 5 numbers shown.

How can I add this to the script or is there any scripts with this already, that work just as simply like this, just dynamically paginating content of a specified class without doing anything more? All I can seem to find are scripts requiring bootstrap, databases, editing the html to differ each item or putting the dynamic content into the javascript file.

Thanks, Jase

Share this post


Link to post
Share on other sites

I don't know the javascript way, but if you want to paginate with php ...

<?php
// Pagination
$totallist = count($your_results); // Count how many in your array.
$pagination_url = "/your-base-page/";
$rowsperpage = 10; // How Many Per Page
$totalpages = ceil($totallist / $rowsperpage);
if(isset($_GET['page'])) {
	if(!is_numeric($_GET['page'])) { 
		// They put ?page=fish or something
	} else {
		$page = (int)$_GET['page'];
		if($page < 1) { $page = 1; } // Stops Page 0.
	}
} else {
	$page = 1; // It's not set so assume the first page.
}
$offset = ($page-1) * $rowsperpage; $result_start = ($page-1)*$rowsperpage+1; $result_end = $result_start+$rowsperpage-1;
if($result_end >= $totallist) { $result_end = $totallist; };
if($page > 1) { if($page > $totalpages) { 
	// The page number is higher than the total pages, I normally 301 to page one.
} }
?>

... output the html results ...

<?php foreach(array_slice($your_results, $offset, $rowsperpage) as $sa) { ?>
<div>Your list item e.g. <?php echo $sa['folder']; ?></div>
<?php } ?>

... then the footer if there is more than one page ...

<?php if($totalpages>=2) { ?>
<div>Page <b><?php echo $page; ?></b> of <b><?php echo $totalpages; ?></b></div>
<div>
<?php $range = 2; // Sets how many pages either side of current, so this would make prev 1, 2, 3 (selected), 4, 5 next
if($page > 1){ $prevpage = $page - 1; echo "<a href='" . $pagination_url . "'"; if($prevpage>= 2) { echo "?page=".$prevpage; }; echo "' rel='prev'>Prev</a>"; }
for($x = ($page - $range); $x < (($page + $range) + 1); $x++) {	if(($x > 0) && ($x <= $totalpages)) { if($x == $page){ echo "<span>".$x."</span>"; } else { echo "<a href='" . $pagination_url; if($x>= 2) { echo "?page=" . $x; } echo "' class='submit yk lr3'>".$x."</a>"; } } }
if($page != $totalpages) { $nextpage = $page + 1; echo "<a href='" . $pagination_url . "?page=" . $nextpage . "' rel='next'>Next</a>"; }
?>
</div>
<?php } ?>

Hope this helps as a fallback :)

Share this post


Link to post
Share on other sites
<?php
	
	// initial array containing the dirs
	    $dirs = glob('*/posts/*', GLOB_ONLYDIR);
	
	// new array with date as key
    	    $dirinfo_arr = [];
            foreach ($dirs as $cdir) {
	
		// read date from file
                    $dirinfo_str = file_get_contents("$cdir/includes/post-info.json");
            	    $dirinfo = json_decode($dirinfo_str, TRUE);
        
        	// add current directory to the info array
        	    $dirinfo['dir'] = $cdir;
        	// add current dir to new array where date is the key
        	    $dirinfo_arr[$dirinfo['Arraysortdate']] = $dirinfo;
    	}
    	// now we sort the new array
    	    krsort($dirinfo_arr);

	    foreach($dirinfo_arr as $key=>$dir) {  // getting current dir from new array
	    	$dirpath = $dir['dir'];
?>

	
    	<div class="paragraph blog-menu-item paging-menu-item">
    	     <img class="blog-img lazy-load lazy-hide" data-src="<?=$dirpath?>/images/main.jpg"/>
    	     <noscript>
    	     	<img class="blog-img" src="<?=$dirpath?>/images/main.jpg"/>
    	     </noscript><br><br>
    	     
             <a href="<?=$dirpath?>">
             	<h1><?php include("$dirpath/includes/title.php");?></h1>
             </a><br>
             
             <span class="blog-date">
             	<strong>Date Published:</strong> <?php include("$dirpath/includes/date.php");?>
             </span><br><br>
             
             <span>
             	<?php include("$dirpath/includes/post-summary.php");?><br><br>
             	<a href="<?=$dirpath?>" style="color:darkred">Continue reading ></a><br><br>
             </span>
    	</div>
    	
<?php
};
?>

This is my PHP script for doing my menu, where $dirpath is the final variable for each array item.

Would I change $your_results to $dirpath and if I want the curent page as the base page, I assume I can just put "index.php" meaning as the index.php in the current folder?

Regarding the second part, I assume I take the echo $sa['folder'] and to add that in the way I have been using $dirpath as in my original script, assign another variable to that echo so I just am then able to do the same like this?

<?php foreach(array_slice($dirpath, $offset, $rowsperpage) as $sa) { 
    $dirpaginpath = echo $sa['folder'];
    ?>

        <div class="paragraph blog-menu-item paging-menu-item">
             <img class="blog-img lazy-load lazy-hide" data-src="<?=$dirpaginated?>/images/main.jpg"/>
             <noscript>
                 <img class="blog-img" src="<?=$dirpaginpath?>/images/main.jpg"/>
             </noscript><br><br>
             
             <a href="<?=$dirpaginpath?>">
                 <h1><?php include("$dirpath/includes/title.php");?></h1>
             </a><br>
             
             <span class="blog-date">
                 <strong>Date Published:</strong> <?php include("$dirpaginpath/includes/date.php");?>
             </span><br><br>
             
             <span>
                 <?php include("$dirpaginpath/includes/post-summary.php");?><br><br>
                 <a href="<?=$dirpaginpath?>" style="color:darkred">Continue reading ></a><br><br>
             </span>
        </div>

<?php } ?>

And then finally I take it that the last part is the PHP for the pager menu?

Edit, seems that it doesn't like this throwing up that the array slice expects an array so using $dirinfo_arr with the slice outside of the bottom foreach seems more correct as it doesn't through up the error, but how do I handle the ['folder'] and ['dir'] with this? Changed back my html to have $dirpath like previously as I assume I go back using that now.

Btw if you need to read up my thread where I built this script to get an understanding if your lost, here's the thread on Web Developer.

Also, if a mod wants to move this to server side forum, feel free as I did mean to do javascript but if php will work then definitely doing that instead.

Edited by jwbjnwolf

Share this post


Link to post
Share on other sites
1 hour ago, jwbjnwolf said:

Would I change $your_results to $dirpath and if I want the curent page as the base page, I assume I can just put "index.php" meaning as the index.php in the current folder?

No, in your example $your_results would be $dirinfo_arr as this is the array you're using for output. Just trying to get my head around what you're trying to do. So this array ...

$dirs = glob('*/posts/*', GLOB_ONLYDIR);

... is just a single dimension array of directories, e.g. "/foldername/"? And the following ...

$dirinfo_str = file_get_contents("$cdir/includes/post-info.json");
$dirinfo = json_decode($dirinfo_str, TRUE);

... is making a multidimensional array of information from the post-info.json, which you push into the $dirinfo_arr. If so what are the keys when you use the following?

<?php foreach($dirinfo_arr as $row) { print_r(array_values($row)); } ?>

... an visual example of this multidimensional would be ...

<?php 
$dirinfo_arr = array(
array('name' => "Something", 'dir' => "/something/", 'date' => "2018-07-09"),
array('name' => "Something Else", 'dir' => "/wibble/", 'date' => "2018-07-01")
);
foreach($dirinfo_arr as $row) { print_r(array_values($row)); }
?>

... so if we loop through this array we can use those keys ...

<?php foreach($dirinfo_arr as $sa) { ?>
<ul>
  <li><?php echo $sa['name']; ?></li>
  <li><a href="<?php echo $sa['dir']; ?>"><?php echo $sa['dir']; ?></a></li>
  <li>Modified: <?php echo date('jS F Y', strtotime($sa['date'])); ?></li>
</ul>
<?php } ?>

... all the array_slice($dirinfo_arr, $offset, $rowsperpage) does is limit the results to the required set for pagination. With regards to the $pagination_url = "/your-base-page/"  you could set this to empty if you want, the reason I use it is to keep the pagination urls clean and also can be combined to use for canonical tags.

Share this post


Link to post
Share on other sites

Right I've included just two results for ease of understanding, along with the post-info.json contents for each.

1:

print_r result:

Array ( [0] => 2018-05-03 [1] => Array ( [0] => May 2018 ) [2] => Array ( [0] => Tutorials ) [3] => tech/posts/test2 ) 

Contents of json file:

{ "Arraysortdate": "2018-05-03",
  "Month": ["May 2018"],
  "Category": ["Tutorials"]
}

2:

print_r result

Array ( [0] => 2017-04-03 [1] => Array ( [0] => April 2017 ) [2] => Array ( [0] => Attention [1] => Friendships [2] => Love [3] => Love & Hate [4] => Pressure ) [3] => staystrong/posts/test-blog-post ) 

Contents of json file:

{
    "Arraysortdate": "2017-04-03",
    "Month": ["April 2017"],
    "Category": [
    		"Attention",
    		"Friendships", 
    		"Love", 
    		"Love & Hate", 
    		"Pressure"
    		]
}

This script is just taking the value of Arraysortdate to order the posts by date in the menu.

But if I also want to filter posts to only a certain category/month, I take the title of the current category/month page that the menu is on, and use in_array to only include posts if the value of either Month or Category matches the page title,, which is used as key.

// get current page title from file
	$pagetitle = file_get_contents("includes/title.php");

// before cycling through $dirinfo_arr for output
    	if(!in_array($pagetitle, $dirinfo['Month']) && !in_array($pagetitle, $dirinfo['Category'])) {
    		continue;
    }

This is done before this part of the script:

// add current dir to new array where date is the key
	$dirinfo_arr[$dirinfo['Arraysortdate']] = $dirinfo;  
   }

 

Edited by jwbjnwolf

Share this post


Link to post
Share on other sites

Hmm, looks like it's getting a bit messy, even reading the other thread, might be easier to form one slick well named multidimensional array.

<?php
// initial array containing the dirs
$dirs = glob('*/posts/*', GLOB_ONLYDIR);
	
// new array with date as key
$dirinfo_arr = array();
foreach ($dirs as $cdir) {
  // read date from file
  $dirinfo_str = file_get_contents($cdir."/includes/post-info.json");
  $dirinfo = json_decode($dirinfo_str, TRUE);
  foreach($dirinfo as $dr) {
    $tmp_month = $dr['Month']; $tmp_category = $dr['Category']; $tmp_sortdate = $dr['Arraysortdate'];
  }
  $tmp_title = file_get_contents($cdir."/includes/title.php"); // If that's where the title is?
  $new_row = array('Arraysortdate' => $tmp_sortdate, 'Month' => $tmp_month, 'Category' => $tmp_category, 'Title' => $tmp_title, 'dir' => $cdir);
  $dirinfo_arr[] = $new_row;
}
// now we sort the new array
foreach($dirinfo_arr as $key => $row) {
  $sdate[$key]  = $row['Arraysortdate'];
  // Could also sort by others too.
  $stitle[$key]  = $row['Title'];
}
array_multisort($sdate, SORT_ASC, $stitle, SORT_ASC, $dirinfo_arr);
?>

Once you have one well formed array the rest is gravy :)

Share this post


Link to post
Share on other sites

Spent a while actually getting a better understanding of what you originally sent. So ['folder'] and ['dir'] is the same thing pretty much, so all I needed to do actually was simply replace 

foreach($dirinfo_arr as $key=>$dir) {
   	$dirpath = $dir['dir'];

with

foreach(array_slice($dirinfo_arr, $offset, $rowsperpage) as $dir) {
	$dirpath = $dir['dir'];

That works flawlessly.

Now regarding the pager navigation.. The 1st page link keeps reloading the current page not page=1, and the prev button doesn't load the last page either. The only difference I've done with your code for the pagination is as you said, make the pagination_url empty so that it's /?page=# instead of /index.php?page=#.

Also, regarding the page titles, the logic there I am doing is for on say a monthly archive page such as 2017/04, which has a title "April 2017". I am taking this title to use as key to only include posts with a matching key "April 2017" in post's post-info.json file.

I did try your multi dimentional array, though that is not sorting by date, only by the folder names. But anyway it is working now with the  original script just changing the above, so now to get the pager sorted. And that multi dimentional array is quite a bit longer whilst excluding where I want to filter the array as described for the script being used by the category/month menu pages. I use this script in 3 differing include files, so keeping it that much shorter does visually help.

Edited by jwbjnwolf

Share this post


Link to post
Share on other sites
1 hour ago, jwbjnwolf said:

Spent a while actually getting a better understanding of what you originally sent. So ['folder'] and ['dir'] is the same thing pretty much

Essentially yes, I had no idea what was in your array to begin with so 'folder' could have been anything; $dir['dir'] is a key. What I was try to show is that it looks like you're not using key => value pairs in a logical way, you'd else need to use $dir[0] for example as it's not been named. Knowing the key => value makes life a lot easier, here's an example;

<?php
$basic_multi = array(
array('name' => "Item One", 'url' => "/item-one", 'options' => array("juice","bread","fish"), 'date' => "April 2017"),
array('name' => "Item Two", 'url' => "/item-two", 'options' => array("apple","milk","toast"), 'date' => "June 2017"),
array('name' => "Item Three", 'url' => "/item-three", 'options' => array("butter","beer","cat"), 'date' => "September 2017")
);
print_r ($basic_multi);
// or a loop
foreach($basic_multi as $b) { ?>
<ul>
<li>Name: <?php echo $b['name']; ?></li>
<li>URL: <?php echo $b['url']; ?></li>
<li>Options:<ul>
  <?php foreach($b['options'] as $o) { ?>
    <li><?php echo $o; ?></li> 
  <?php } ?>
</ul></li>
</ul>
<?php }
// or reorder
// now we sort the new array
foreach($basic_multi as $key => $row) {
  $sname[$key]  = $row['name'];
}
array_multisort($sname, SORT_ASC, $basic_multi);
foreach($basic_multi as $b) { ?>
<ul>
<li>Name: <?php echo $b['name']; ?></li>
<li>URL: <?php echo $b['url']; ?></li>
<li>Options:<ul>
  <?php foreach($b['options'] as $o) { ?>
    <li><?php echo $o; ?></li> 
  <?php } ?>
</ul></li>
</ul>
<?php } ?>

... this should explain why named keys are cool, sql with php even has mysqli_fetch_assoc to keep those keys intact, much easier to see whats going on. Run that php on http://phpfiddle.org/ and you'll see we now have keys;

Array ( [0] => Array ( [name] => Item One [url] => /item-one [options] => Array ( [0] => juice [1] => bread [2] => fish ) [date] => April 2017 ) [1] => Array ( [name] => Item Two [url] => /item-two [options] => Array ( [0] => apple [1] => milk [2] => toast ) [date] => June 2017 ) [2] => Array ( [name] => Item Three [url] => /item-three [options] => Array ( [0] => butter [1] => beer [2] => cat ) [date] => September 2017 ) )

The sort by title was just an example of sorting by one column and then by a second, SORT_ASC and SORT_DESC both work here. What I was trying to do was help to build a single array with keys and everything you need to output before the main html list.

With regards to pagination, the $pagination_url variable is to be the page on which the listings and pagination need to be. If I was to paginate this thread it would be;

$pagination_url = "/topic/87637-adding-features-to-a-dynamic-pagination-script/";

... then with the pagination php it would form the following if on page 3 and there are 4 pages;

<a href="/topic/87637-adding-features-to-a-dynamic-pagination-script/?page=2" rel="prev">Prev</a>
<a href="/topic/87637-adding-features-to-a-dynamic-pagination-script/">1</a>
<a href="/topic/87637-adding-features-to-a-dynamic-pagination-script/?page=2">2</a>
<span>3</span>
<a href="/topic/87637-adding-features-to-a-dynamic-pagination-script/?page=4">4</a>
<a href="/topic/87637-adding-features-to-a-dynamic-pagination-script/?page=4" rel="next">Next</a>

so when clicked it goes to the right url and page, sounds like making it blank isn't a go, use the real uri instead to keep it clean, something you could set at the start of the page.

Edited by BrowserBugs

Share this post


Link to post
Share on other sites

I think it may be that the script doesn't like "?=" being right after "/" in thr url or something as I also tried with having "{$_SERVER['REQUEST_URI']}" in but that did the same thing. So I've just simply put "index" and now that works as it should. 

Now to play about with styling the pager for my liking.

Though any possibility of adding first/last buttons which show accordingly like the prev/next buttons do?

Edited by jwbjnwolf

Share this post


Link to post
Share on other sites

Yep that would be ...

<a href="<?php echo $pagination_url; ?>">First</a>
<a href="<?php echo $pagination_url; ?>?page=<?php echo $totalpages; ?>">Last</a>

 

Share this post


Link to post
Share on other sites

Brilliant. Played about with css as well as changing the active page from <span> to <a class="active">, and have it looking quite nicely!

232800260_Screenshot_Internet_20180709-2230472.png.74e0c8f44527d4fa6e95edc48f75ae88.png

Though, one thing I notice is previous keeps going back to page 1 regardless of current page. That's the only thing that's now been done incorrectly. Is that because I've changed <span> to <a class="active">?

Edit: Just changed the last text to last page number and removed the first, as really knowing the total pages is all that's needed really, and allows me to have two number buttons each side of the active page without it going off onto a second row on mobile, whilst keeping it at a reasonable size.

Edited by jwbjnwolf

Share this post


Link to post
Share on other sites

Ah, sorry spotted the bug, stray "'";

if($page > 1){ $prevpage = $page - 1; echo "<a href='" . $pagination_url . "'"; if($prevpage>= 2) { echo "?page=".$prevpage; }; echo "' rel='prev'>Prev</a>"; }

should be

if($page > 1){ $prevpage = $page - 1; echo "<a href='" . $pagination_url; if($prevpage>= 2) { echo "?page=".$prevpage; }; echo "' rel='prev'>Prev</a>"; }

 

Share this post


Link to post
Share on other sites

Brilliant thanks! Something I worked out yesterday whilst I was waiting for you to get back on that, how to print the categories from the json into the html as links to the categories of the same names. As well as also finding how to use htaccess for changing uppercase to lowercase.

112909517_Screenshot_Internet_20180710-1026182.png.29064054320e60c82d3ce5e165216f3d.png

Very impressed with all this now.

Lastly, how do I can I add this pager in another place as well such as above the folder array at the top of the page so that people can use it without scrolling down?

Share this post


Link to post
Share on other sites
10 minutes ago, jwbjnwolf said:

Brilliant thanks! Something I worked out yesterday whilst I was waiting for you to get back on that, how to print the categories from the json into the html as links to the categories of the same names. As well as also finding how to use htaccess for changing uppercase to lowercase.

Yep arrays in arrays = multidimensional array. In my $basic_multi example it uses the array $b['options'] for the second list. The reason keys are important is because it makes life easier if things move around, plus you can find single things easily;

<?php
$basic_multi = array(
array('name' => "Item One", 'url' => "/item-one", 'options' => array("juice","bread","fish"), 'date' => "April 2017"),
array('name' => "Item Two", 'url' => "/item-two", 'options' => array("apple","milk","toast"), 'date' => "June 2017"),
array('name' => "Item Three", 'url' => "/item-three", 'options' => array("butter","beer","cat"), 'date' => "September 2017")
);
echo $basic_multi[1]['options'][2]; // Is Toast
foreach($basic_multi as $b){
echo $b['options'][2]; // Is also toast
}
?>

 With regards to htaccess it can be [nc] which doesn't make a difference on case, probably my go to for sites. PHP has enough toys for sorting out case;

<?php
$word = "UPPERCASE WORDS";
echo strtolower($word); // "uppercase words"
echo ucfirst(strtolower($word)); // "Uppercase words"
echo ucwords(strtolower($word)); // "Uppercase Words"
?>

 

51 minutes ago, jwbjnwolf said:

Lastly, how do I can I add this pager in another place as well such as above the folder array at the top of the page so that people can use it without scrolling down?

Just copy the pagination and move it above, but the array sorting etc needs to be before both. I normally do all my array sorting etc above the opining <html> so it's complete and ready to roll before the page gets displayed. This means you can handle any problems before the page sends a header, so for example 301 if the page number is higher than the total pages.

<?php // Do all your array work here as $page will be set, $dirinfo_arr will be ready etc. ?>
<html>
<head>
<title>Title</title>
</head>
<body>
  <h1>Title</h1>
  <?php // output the pagination $page ?>
  <div>1 | 2 | 3</div>
  <?php // output $dirinfo_arr ?>
  <div>Item One</div>
  <?php // output the pagination again $page ?>
  <div>1 | 2 | 3</div>
</body>
</html>

 

Share this post


Link to post
Share on other sites

Ok thanks! Worked it out that needs to be just before the foreach array slice line. 

Got the pagination and pager scripts in their own files including in the array script, so keeps the array script files very neat as well as obviously don't need to duplicate the pagingation/pager scripts for other array scripts for other parts of my site etc.

Thanks for all the help :)

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By 98sfsdf8
      Hi all,
      I am trying to change through images when scrolling, (and I understand that maybe the jquery is a bit messy but it seems to be working) but i would like:
      - to be able to have images of different heights and widths, not all the same size (as it is now).
      - vertically/horizontally centered.
      Here is a fiddle: https://jsfiddle.net/postcolonialboy/WTkqn/486/
      Thanks!
      HTML:
      <div id="contentwrapper">       <div class="centreme">         <img src="https://picsum.photos/200/200?image=1" id="animation" />         <img class="hidden" src="https://picsum.photos/200/200?image=1" />         <img class="hidden" src="https://picsum.photos/200/200?image=2" />         <img class="hidden" src="https://picsum.photos/200/200?image=3" />         <img class="hidden" src="https://picsum.photos/200/200?image=4" />         <img class="hidden" src="https://picsum.photos/200/200?image=5" />         <div id="bottommark"></div>       </div>     </div> CSS:
      body,       html {         height: 7000px;         margin: 0;         background-color: grey;       }       .hidden {         position: absolute;         top: -9999999px       }       #bottommark {         position: absolute;         bottom: 0;       }       #contentwrapper {         width: 100%;         height: 100%;         position: fixed;       }       .centreme {         position: fixed;         width: 200px;         /* the image width */         height: 200px;         /* the image height */         top: 50%;         left: 50%;         margin-top: -100px;         /* half the image height */         margin-left: -100px;         /* half the image width */       } JS:
      $(document).ready(function() { var a = $(document).height(); var b = a - $("#bottommark").position().top; $(window).scroll(function() { var e = $(document).height(); var f = $(window).scrollTop(); var c = e - $("#bottommark").position().top - f; var d = b / 5; $("span").html(c); if (c > d * 4) { $("#animation").attr("src", "https://picsum.photos/200/200?image=1") } if ((c < d * 4) && (c > d * 3)) { $("#animation").attr("src", "https://picsum.photos/200/200?image=2") } if ((c < d * 3) && (c > d * 2)) { $("#animation").attr("src", "https://picsum.photos/200/200?image=3") } if (c < d * 2 && c > d * 1) { $("#animation").attr("src", "https://picsum.photos/200/200?image=4") } if (c < d) { $("#animation").attr("src", "https://picsum.photos/200/200?image=5") } }) });  
    • By milanrehor
      Hello, I should have a question. We develop our e-shop and try to link the instagram feeds with our site (create a gallery of images on a certain hashtag). Despite the instafeedjs (it's jS, but maybe another alternative will be needed - PHP, for example), it worked good just for a specific ID. The problem is that I need photos from the entire instagram, which are filtered to a certain hastag eg #KFC. Does anyone have experience with it? Does anyone know how to do it? Or does anyone have a link where the information needed to look for it?
      We do not use any CMS due to bad experience, not only in our group, but in general. We write everything from base (HTML, CSS, JS, etc.)
      Thank you very much in advance, any answer would help me.
      PS: Sry for my bad English :p :D
    • By Gee_suss
      I need to put a link in the footer and create a new privacy page for this website (www.mala.co.uk). The footer is in php and is pasted into the code of each page. What I have done is created a test server and I have copied all of the files via ftp to this new location so I can make the changes.
      What I have found is that the website does not display correctly and none of the CSS or PHP is showing. Even though all I have done is copy all the files from one place to another.
      I did not create the website and I am wondering if the previous developer has done something to stop it being amended or copied. I am somewhat a novice but though I would be able to make the simple changes.
      PLEASE HELP! Kind Regards...


    • By lcot
      I am on the search for a jQuery or even vanillaJS-based plugin that can replicate similar functionality to that of the 'FIND WHAT MATTERS' section of this web HOMEPAGE . It is the 'team grid' section where there are rows of responsive images, and a dropdown container beneath each row that contains dymanic content dependent on which 'accordian item' or image was clicked on.
      You can see a screenshot here: https://monosnap.com/file/M8zQInDm6d3IQ84QOb49Y0JqSlA78F
      The grid is responsive, shrinking from 8 per row, to 3 per row on mobile and the dropdown expands beneath the row of the image, no matter the screen size.
      Does anyone know of any plugin that can achieve this functionality, or am I going to have to develop this by myself?
      Thanks!
  • Recently Browsing

    No registered users viewing this page.

  • Member Statistics

    • Total Members
      58,416
    • Most Online
      4,970

    Newest Member
    angelsphone09
    Joined
  • Forum Statistics

    • Total Topics
      65,740
    • Total Posts
      452,901
×