How to create the main page?


The main page is divided into 9 tiles, each tile being a reference to an internal page (works as a secondary menu). In case you have more than 9 pages it's recommended to pick 9 of them (the most important ones) and link them on the main page and also to create a side menu which will contain the full menu. But if you have less then 9 page on your resume then just remove the 'js-goto' class on the tiles that are superfluous.

If you want to add some external links on your main page, just replace the 'cv-tile' <div> with a regular <a> by keeping the old classes except the 'js-goto' and of course don't forget to add a valid 'href' on it.

<section class="main-page" id="main-page">
	<div data-target="[Page ID]" class="cv-tile js-tile top-left js-goto">
		<img src="img/placeholder.png" alt="" class="placeholder-img">
		<div class="cv-tile-content">
			<h5 class="tile-title">[Page Title]</h5>
		</div>
	</div>
	<div data-target="[Page ID]" class="cv-tile js-tile top-center js-goto">
		<img src="img/placeholder.png" alt="" class="placeholder-img">
		<div class="cv-tile-content">
			<h5 class="tile-title">[Page Title]</h5>
		</div>
	</div>
	<div data-target="[Page ID]" class="cv-tile js-tile top-right js-goto">
		<img src="img/placeholder.png" alt="" class="placeholder-img">
		<div class="cv-tile-content">
			<h5 class="tile-title">[Page Title]</h5>
		</div>
	</div>
	<div data-target="[Page ID]" class="cv-tile js-tile center-left js-goto">
		<img src="img/placeholder.png" alt="" class="placeholder-img">
		<div class="cv-tile-content">
			<h5 class="tile-title">[Page Title]</h5>
		</div>
	</div>
	<div data-target="[Page ID]" class="cv-tile js-tile center-center js-goto">
		<img src="img/placeholder.png" alt="" class="placeholder-img">
		<div class="cv-tile-content">
			<h5 class="tile-title">[Page Title]</h5>
		</div>
	</div>
	<div data-target="[Page ID]" class="cv-tile js-tile center-right js-goto">
		<img src="img/placeholder.png" alt="" class="placeholder-img">
		<div class="cv-tile-content">
			<h5 class="tile-title">[Page Title]</h5>
		</div>
	</div>
	<div data-target="[Page ID]" class="cv-tile js-tile bottom-left js-goto">
		<img src="img/placeholder.png" alt="" class="placeholder-img">
		<div class="cv-tile-content">
			<h5 class="tile-title">[Page Title]</h5>
		</div>
	</div>
	<div data-target="[Page ID]" class="cv-tile js-tile bottom-center js-goto">
		<img src="img/placeholder.png" alt="" class="placeholder-img">
		<div class="cv-tile-content">
			<h5 class="tile-title">[Page Title]</h5>
		</div>
	</div>
	<div data-target="[Page ID]" class="cv-tile js-tile bottom-right js-goto">
		<img src="img/placeholder.png" alt="" class="placeholder-img">
		<div class="cv-tile-content">
			<h5 class="tile-title">[Page Title]</h5>
		</div>
	</div>
</section>

Last update:
2015-09-30 16:28
Author:
Cristina Cavruc
Revision:
1.1
Average rating:0 (0 Votes)