Classic KIA Texarkana

[joer80]

Just popped out another bootstrap and processwire auto website!  I am getting to where I can do these in 1 to 2 weeks now!

 

Uses the bootstrap carousel for the slider, Google maps marker module and the form templates processor module on the detail page.  Also using redirects module and batcher.  (Redirects for the sub menu items under inventory to send the user to the search page with the correct query strings.) 

 

I also use a cron that reads an inventory csv file and makes or updates processwire pages based on the vin number.

 

http://www.classictexarkanakia.com

[SiNNuT]

I like it. One small thing, on smaller resolutions the model name and info flow a bit strangely around the picture:

[ODDCODE]

Very clean and nice design website.

[joer80]

I just changed the code that creates the navigation to use the $pages->find('parent=1') instead of the renderChildrenOf function and it made my website much faster!

The website went from having a 3-5 second php delivery to a 700ms php delivery.  (index.php's time in google chrome.)

I am assuming it is because it loads the page information for all pages under your homepage, so if you have thousands of pages, it adds unnecessary overhead vs the parent= which just gets 1 level.   Bootstrap only makes use of 2 levels so that is not very efficient.

Just wanted to let you know I speed up my website big time by using this method!

The slower renderChildrenOf  function is used in the Bootstrap 3 site profile in the modules directory.  That is why I started off with that.   http://modules.processwire.com/modules/process-wire-bootstrap3/

[joer80]

This is the code I used:

$LogoImage = 'Classic-KIA.png';

//Make the menu
//echo the starting code
echo '<nav class="navbar navbar-default navbar-fixed-top" role="navigation">  <!-- navbar-fixed-top -->
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
  <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse-1">
	<span class="sr-only">Toggle navigation</span>
	<span class="icon-bar"></span>
	<span class="icon-bar"></span>
	<span class="icon-bar"></span>
  </button>
  <a class="navbar-brand" href="' . $config->urls->root . '"><img src="' . $config->urls->templates . 'images/' . $LogoImage . '" class="Logo" alt="' . $LocationPage->title . ' Logo" /></a>
</div>

<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="navbar-collapse-1">';

echo '<div id="AboveNav"><i class="fa fa-phone"></i>  ' . $LocationPage->Location_PhoneNumber_Switchboard . '     <i class="fa fa-flag"></i>  ' . $LocationPage->Location_AddressStreet . ' ' . $LocationPage->Location_City . ', ' . $LocationPage->Location_StateAbrv . '</div><!--      -->';
echo '<ul class="nav navbar-nav navbar-right">';

//Make the top level links
$TopLevelNavLinks = $pages->find('parent=1');

//add home link
echo '<li><a href="/">Home</a></li>'; //could use $config->urls->root

//Build Top Level Links
foreach($TopLevelNavLinks as $TopLevelNavLink){
	
	//Look up this top level link to build a drop down if it needs it
	$SecondLevelNavLinks = $pages->find("parent=$TopLevelNavLink->id, sort=sort");
	$SecondLevelTotal = $SecondLevelNavLinks->getTotal();
	
	//If I am on this page, add the active class
	if($page->id == $TopLevelNavLink->id){
	  $classTag = ' active';
	} else {
	  $classTag = '';  
	}
	
	//if there is atleast one sublink, put me in a dropdown
	if($SecondLevelTotal > 0){
	  //Dont make link take user to page.  Instead, open a dropdown menu.
	  echo '<li class="dropdown' . $classTag . '">';
	  echo '<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">' . $TopLevelNavLink->title . ' <span class="caret"></span></a>';
	  echo '<ul class="dropdown-menu" role="menu">';	
	  
	  //loop through the second level
	  foreach($SecondLevelNavLinks as $SecondLevelNavLink){
		  
	  //If I am on this page, add the active class
	  if($page->id == $SecondLevelNavLink->id){
		$classTag2ndlevel = ' class="active" ';
	  } else {
		$classTag2ndlevel = '';  
	  }
	  
		echo '<li' . $classTag2ndlevel . '><a href="' . $SecondLevelNavLink->url . '">' . $SecondLevelNavLink->title . '</a></li>';
		
	  }
	  
	  echo '</ul>';	
		  
	} else {
	  //Make link take user to page	  
	  echo '<li class="nodropdown' . $classTag . '"><a href="' . $TopLevelNavLink->url . '">' . $TopLevelNavLink->title . '</a></li>';
	}
	
} //end of built top level nav links

	

//echo the ending code
echo '</ul></div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>';