Modal Windows

[raw]
[one_fourth]

[modal-link name=”modal1″]Text link to show Modal Window[/modal-link]

[/one_fourth]
[three_fourth_last]

Open Modal by Text link

This is the picture link to open custom modal window. Click on the icon to show the content of this Modal Window.

[/three_fourth_last]
[frame bgcolor=”#f2f2f2″ version=”light”]

[modal-link name="modal1"]Text link to show Modal Window[/modal-link]

[/frame]
[/raw]

[raw]
[one_fourth]
[modal-link name=”modal1″][/modal-link]
[/one_fourth]
[three_fourth_last]

Open Modal by Picture or Icon link

This is the standard text link to open custom modal window. Click on the link to show the content of this Modal Window.

[/three_fourth_last]
[frame bgcolor=”#f2f2f2″ version=”light”]

[modal-link name="modal1"]<img src="...">[/modal-link]

[/frame]
[/raw]

[raw]
[one_fourth]
[button title=”OPEN” modalname=”modal1″ description=”Modal Window” width=”100%” version=”light” position=”left” bgcolor=”#5FCAFF” color=”#FFFFFF”]
[/one_fourth]
[three_fourth_last]

Open Modal by Button link

This is the button created by shortcode to open custom modal window. Click on the button to show the content.

[/three_fourth_last]
[frame bgcolor=”#f2f2f2″ version=”light”]

[button title="OPEN" modalname="modal1" description="Modal Window"
width="100%" version="light" position="left" bgcolor="#5FCAFF"
color="#FFFFFF"]

[/frame]
[/raw]

 

Modal Window Content

You need to define the Modal Window Content somewhere on the end of the page to create something like this. You can define several modal windows and call them by the name parameter.

[raw]
[frame bgcolor=”#f2f2f2″ version=”light”]

[modal-content name="modal1" width="600px" height="550px"]
Content
[/modal-content]

[/frame]
[/raw]

[raw]
[modal-content name=”modal1″ width=”600px” height=”550px” ]

Modal Window

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

[image]

[/image]

[/modal-content]
[/raw]

Advertisements

Comments are closed.

Sarita

You can enter your email address to subscribe to this and receive notifications of new posts by email.

Join 167 other followers

%d bloggers like this: