Υποενότητα 4.3: Αποκάλυψη περιεχομένου

Στο επόμενο βήμα εισάγουμε το modal στην ιστοσελίδα. Για να ρυθμίσετε το modal, προσθέστε τον ακόλουθο κώδικα αμέσως μετά τη γραμμή πλοήγησης Navbar στο επάνω μέρος της σελίδας.

Modal code:

Στη συνέχεια, εισάγουμε έναν άλλο σύνδεσμο στη δεξιά πλευρά της navbar  για να ενεργοποιήουμε την εμφάνιση του modal. Για να το κάνετε αυτό, προσθέστε τον ακόλουθο κώδικα στη navbar μετά το </ul>

<span class="navbar-text">
  <a data-toggle="modal" data-target="#loginModal">
     <span class="fa fa-sign-in"></span> Login
   </a>
 </span>

Προσθέστε mr-auto class στη <ul> της navbar ως εξής:

<ul class="navbar-nav mr-auto">

Εισαγάγουμε έναν άλλο σύνδεσμο στα δεξιά της  navbar  χρησιμοποιώντας το navbar-text και χρησιμοποιώντας τη mr-auto class στο <ul>. Αυτός περιέχει έναν σύνδεσμο με <a> tag με data-toggle="modal" και data-target="#loginModal" attributes.

Αυτός ο κώδικας θα δημιουργήσει μια σελίδα που εμφανίζεται ως εξής: