Button "Log in"

The "Log in" button is created when the menu item has class gkLogin defined in the GK Additional Menu Parameters. This CSS class creates a connection between menu item and the login popup. Please remember to publish the module on the login module position in order to get working popup.

The newest change is adding in the template language file phrase: TPL_GK_LANG_MYACCOUNT - this phrase is displayed instead of the menu item with gkLogin class when user is logged in and defaultly is displayed as "My Account".

Video block

The video block can be created in the Custom HTML module - the background is defined by the background image option and the content should look like the below code:

<a href="/VIDEO_URL" class="modal gkVideoBlock" rel="{handler: 'iframe', size: {x: 640, y: 480}}">Take a tour</a>

The above code will create a block which will open a popup with video after clicking it.

Information form

The above form is created by the following code:

<form action="#" class="gkInformation">
<div>
<strong>Get info based on<br /> your study lavel</strong>
<input type="text" placeholder="Full name" name="full-name" />
<input type="text" placeholder="Your education level" name="education-level" />
<input type="email" placeholder="Your e-mail" name="email" />
<input type="submit" value="Request information" />
</div>
</form>

Content block with image and buttons

The above content block is created by the following code:

<img src="/images/demo/students.jpg" class="gkContentImage" alt="University Joomla and WordPress Template" />

<div class="gkContent">
<p>Ut imperdiet ipsum vel est congue, a vestibulum orci faucibus. Mauris dictum orci ornare arcu placerat, eu porta quam sollicitudin. Fusce in dapibus turpis. Curabitur imperdiet fermentum tellus.</p>

<p>Nunc suscipit magna vitae nisi blandit, lacinia pellentesque elit euismod. Quisque ut mattis dolor, a gravida turpis.</p>

<a href="/index.php/about-us">More details…</a>
</div>

<ul class="gkContentList" data-cols="3">
<li><a href="#">Be part of us</a></li>
<li><a href="#">Find allies</a></li>
<li><a href="#">Get support</a></li>
</ul>

Menu with icons

In order to create menu with icons you have to add icons-menu suffix to the Custom HTML module and use as a content the following code:

<ul>
<li><a href="#"><i class="gk-icon-script"></i>How to apply</a></li>
<li><a href="#"><i class="gk-icon-calendar"></i>Deadlines</a></li>
<li><a href="#"><i class="gk-icon-marker"></i>Plan a visit</a></li>
<li><a href="#"><i class="gk-icon-education"></i>Find a major</a></li>
<li class="last-item"><a href="#">More details…</a></li>
</ul>

Social icons, newsletter, positioned title

In order to create a bar with modules you have to add to the page suffix bottomX-bar where X is a number of the bottom module position i.e. bottom3-bar.

The above bar is based on 3 Custom HTML modules which uses the following code:

Social Icons

<ul class="gk-social-icons">
<li><a class="gk-icon-gplus-outline" href="https://plus.google.com/+gavickpro/posts">Google+</a></li>
<li><a class="gk-icon-twitter-outline" href="https://twitter.com/gavickpro">Twitter</a></li>
<li><a class="gk-icon-fb-outline" href="https://www.facebook.com/gavickpro">Facebook</a></li>
<li><a class="gk-icon-youtube-outline" href="#">YouTube</a></li>
<li><a class="gk-icon-linkedin-outline" href="#">LinkedIn</a></li>
</ul>

Positioned title

<h3 class="gkBottomTitle">Campus Life</h3>

Newsletter

<form class="gk-newsletter" action="#">
<p><input type="email" placeholder="Your e-mail address" /> <span><input type="button" value="Subscribe" /></span></p>
</form>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus rutrum, libero id imperdiet elementum, nunc quam gravida mi, vehicula euismod magna lacus ornare mauris. Proin euismod scelerisque risus. Vivamus imperdiet hendrerit ornare. Phasellus dapibus imperdiet nibh, nec sagittis odio condimentum sed. Phasellus dignissim, massa nec ornare fermentum, ligula massa varius dolor, a interdum nisl purus eu magna.

Donec a imperdiet mi. Nulla quis tincidunt ante, id congue mi. Mauris gravida dolor sit amet sem pellentesque, sed pellentesque nulla varius. Sed congue, sapien ut pulvinar auctor, lectus eros tristique sapien, quis elementum risus ante eu justo. Aenean gravida velit odio, sit amet gravida velit suscipit id. Sed suscipit mauris velit, quis congue eros pellentesque nec. Morbi quis diam diam.

• Nunc viverra elit risus, adipiscing placerat nibh malesuada nec. Quisque accumsan placerat odio, a sodales arcu sollicitudin non.
• Vivamus bibendum condimentum lacus, id fermentum dolor. Cras placerat nisl sed eros rutrum porttitor. Proin quis laoreet est. Sed ac ultricies nunc.
• Donec fringilla libero erat, ut mollis urna auctor eu. Sed id lectus tempus, rhoncus nisl nec, placerat dui. Quisque nisl lorem, hendrerit id quam sed, sodales porttitor justo. Nullam vehicula condimentum iaculis.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus rutrum, libero id imperdiet elementum, nunc quam gravida mi, vehicula euismod magna lacus ornare mauris. Proin euismod scelerisque risus. Vivamus imperdiet hendrerit ornare. Phasellus dapibus imperdiet nibh, nec sagittis odio condimentum sed.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus rutrum, libero id imperdiet elementum, nunc quam gravida mi, vehicula euismod magna lacus ornare mauris. Proin euismod scelerisque risus. Vivamus imperdiet hendrerit ornare. Phasellus dapibus imperdiet nibh, nec sagittis odio condimentum sed. Phasellus dignissim, massa nec ornare fermentum, ligula massa varius dolor, a interdum nisl purus eu magna.

Donec a imperdiet mi. Nulla quis tincidunt ante, id congue mi. Mauris gravida dolor sit amet sem pellentesque, sed pellentesque nulla varius. Sed congue, sapien ut pulvinar auctor, lectus eros tristique sapien, quis elementum risus ante eu justo. Aenean gravida velit odio, sit amet gravida velit suscipit id. Sed suscipit mauris velit, quis congue eros pellentesque nec. Morbi quis diam diam.

• Nunc viverra elit risus, adipiscing placerat nibh malesuada nec. Quisque accumsan placerat odio, a sodales arcu sollicitudin non.
• Vivamus bibendum condimentum lacus, id fermentum dolor. Cras placerat nisl sed eros rutrum porttitor. Proin quis laoreet est. Sed ac ultricies nunc.
• Donec fringilla libero erat, ut mollis urna auctor eu. Sed id lectus tempus, rhoncus nisl nec, placerat dui. Quisque nisl lorem, hendrerit id quam sed, sodales porttitor justo. Nullam vehicula condimentum iaculis.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus rutrum, libero id imperdiet elementum, nunc quam gravida mi, vehicula euismod magna lacus ornare mauris. Proin euismod scelerisque risus. Vivamus imperdiet hendrerit ornare. Phasellus dapibus imperdiet nibh, nec sagittis odio condimentum sed.

Ut imperdiet ipsum vel est congue, a vestibulum orci faucibus. Mauris dictum orci ornare arcu placerat, eu porta quam sollicitudin. Fusce in dapibus turpis. Curabitur imperdiet fermentum tellus, nec eleifend felis pharetra vel. Praesent lobortis, arcu eu tempor dapibus, justo quam sagittis turpis, in adipiscing felis enim sit amet sem.