Nájdi ten správny materiál:

Animated hover CSS3 effects for images

These shortcodes allows you to display an image and its description with animated CSS3 effect.
Note: If you would like to add your own text into the image description, just modify the shortcode below or edit an existing shortcode of the demo template.

Parameters

  • title
  • subtitle
  • effect : saddie / goliath / julia / marley
  • background : URL to image with http://
  • fontcolor : color value (HEX)
  • width : size in PX
  • height : size in PX
  • link : URL with http://
  • target : _self / _blank

Example 1

[anibox effect="sadie" background="http://placehold.it/480x360" fontcolor="#000000" width="480" height="360" link="#" title="Example Title Alternative" subtitle="Lorem ipsum dolor sit amet."]
Lorem ipsum dolor si

Example Title 1

Lorem ipsum dolor sit amet.

#

Example 2

[anibox effect="goliath" background="http://placehold.it/480x360"  fontcolor="#ffffff" width="480" height="360" link="#" title="Example Title Alternative" subtitle="Lorem ipsum dolor sit amet."]
Lorem ipsum dolor si

Example Title 2

Lorem ipsum dolor sit amet.

#

Example 3

[anibox effect="julia" background="http://placehold.it/480x360" fontcolor="#000000" width="480" height="360" link="#" title="Example Title Alternative" subtitle="Lorem ipsum dolor sit amet."]
Lorem ipsum dolor si

Example Title 3

Lorem ipsum dolor sit amet.

Viac

Example 4

[anibox effect="marley" background="http://placehold.it/480x360" fontcolor="#ffffff" width="480" height="360" link="#" title="Example Title Alternative" subtitle="Lorem ipsum dolor sit amet."]
Lorem ipsum dolor si

Example Title 4

Lorem ipsum dolor sit amet.

#

Testimonial

Parameters

  • title
  • subtitle
  • class : custom css class (eg. right)
[testimonial class="right" title="bill gates" subtitle="famous visionary"] Nunc at pellentesque... [/testimonial]
Nunc at pellentesque massa, a euismod nisl. Sed quam diam, ultrices ac enim a, cursus gravida lorem. Etiam non suscipit massa. Proin condimentum tristique augue ac varius. Maecenas feugiat ex vitae massa viverra tincidunt et sed tellus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia.
bill gates
famous visionary
[testimonial title="steven tyler" subtitle="famous singer"] Nunc at pellentesque... [/testimonial]
Nunc at pellentesque massa, a euismod nisl. Sed quam diam, ultrices ac enim a, cursus gravida lorem. Etiam non suscipit massa. Proin condimentum tristique augue ac varius. Maecenas feugiat ex vitae massa viverra tincidunt et sed tellus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia.
steven tyler
famous singer

Video Gallery

Parameters

  • id : ID of video
  • web : youtube / vimeo
  • fs : 1 / 0
  • size : 1 – 12 (grid)
[row][pevideo id="Hq8SzbapPkA" web="youtube" fs="1" size="4"][pevideo id="74195893" web="vimeo" fs="1" size="4"][pevideo id="_XwrAefrCxc" web="youtube" fs="0" size="4"][/row][row][pevideo id="dtncYXTbjOk" web="youtube" fs="1" size="6"][pevideo id="hIhXtoyN_6A" web="youtube" fs="1" size="6"][/row]

Image Gallery

Parameters

  • orderby : none / ID / author / title / date / modified / parent / rand / comment_count / menu_order / post__in
  • order : ASC / DESC
  • id : image ID
  • columns : 1 – 12 (grid)
  • size : full / medium / thumbnail (image size)
  • link : URL with http://
  • modal : enable / disable
[pegallery modal="enable" size="full" columns="3" ids="2172, 2173, 2174, 2175, 2176, 2177" orderby="rand"]

Accordion

This shortcode allows you to display accordion panels inside posts or widgets.
Note: Remember to always set the accordion title, and if you want that one of the accordions to be open on page load then enter the status attribute to „active“.

Parameters

  • title
  • status : active
[accordion][accordion_content title="Accordion 1" status="active"] Ut lectus felis... [/accordion_content][accordion_content title="Accordion 2"] Ut lectus felis... [/accordion_content][accordion_content title="Accordion 3"] Ut lectus felis... [/accordion_content][/accordion]
Ut lectus felis, facilisis nec erat at, pretium pellentesque lectus. Donec sit amet nibh est. Morbi augue libero, pretium vitae nulla ac, malesuada ultricies neque. Donec eget neque erat. Nam dictum justo sit amet placerat consectetur. Maecenas laoreet, ligula vel scelerisque ultricies, lorem urna luctus odio, eget convallis urna erat quis justo. Morbi vel placerat nisl, ut tempor odio. Sed lacinia purus sit amet lorem dictum tincidunt. Nunc placerat egestas vehicula. Fusce eu risus sit amet metus sagittis volutpat vehicula porttitor elit. Sed fringilla purus sed mi scelerisque scelerisque. Donec vel enim ligula. Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor. In mattis velit ut nunc luctus ultrices. Nunc aliquet risus eget lorem dignissim, id imperdiet nulla ultricies. Sed euismod bibendum dui, vel faucibus quam tempor at. Etiam sagittis massa in urna sagittis, non viverra nibh placerat.

Tabs

This shortcode allows you to display tabs inside posts or widgets.
Note: Remember to always set the tab title, and if you want than one of the tabs to be open on page load then enter the status attribute to „active“.

Parameters

  • class : custom css class
  • title
  • status : active
[tabs][tab title="Tab 1" status="active"] Sed fringilla purus... [/tab][tab title="Tab 2"] Maecenas laoreet, ligula... [/tab][tab title="Tab 3"] Pellentesque sodales elit... [/tab][/tabs]
Sed fringilla purus sed mi scelerisque scelerisque. Donec vel enim ligula. Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor. In mattis velit ut nunc luctus ultrices. Nunc aliquet risus eget lorem dignissim, id imperdiet nulla ultricies. Sed euismod bibendum dui, vel faucibus quam tempor at. Etiam sagittis massa in urna sagittis, non viverra nibh placerat.
Maecenas laoreet, ligula vel scelerisque ultricies, lorem urna luctus odio, eget convallis urna erat quis justo. Morbi vel placerat nisl, ut tempor odio. Sed lacinia purus sit amet lorem dictum tincidunt. Nunc placerat egestas vehicula.
Pellentesque sodales elit id pellentesque convallis. Sed sit amet lacinia augue. Nunc sit amet sapien neque. Donec neque neque, hendrerit et gravida eget, aliquam quis urna.
[tabs class="pe-clean"][tab title="Tab 1" status="active"] Sed fringilla purus... [/tab][tab title="Tab 2"] Maecenas laoreet, ligula... [/tab][tab title="Tab 3"] Pellentesque sodales elit... [/tab][/tabs]
Sed fringilla purus sed mi scelerisque scelerisque. Donec vel enim ligula. Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor. In mattis velit ut nunc luctus ultrices. Nunc aliquet risus eget lorem dignissim, id imperdiet nulla ultricies. Sed euismod bibendum dui, vel faucibus quam tempor at. Etiam sagittis massa in urna sagittis, non viverra nibh placerat.
Maecenas laoreet, ligula vel scelerisque ultricies, lorem urna luctus odio, eget convallis urna erat quis justo. Morbi vel placerat nisl, ut tempor odio. Sed lacinia purus sit amet lorem dictum tincidunt. Nunc placerat egestas vehicula.
Pellentesque sodales elit id pellentesque convallis. Sed sit amet lacinia augue. Nunc sit amet sapien neque. Donec neque neque, hendrerit et gravida eget, aliquam quis urna.

Grid

This shortcode allows you to display columns inside posts or widgets. Note: It is needed to use the col short inside row shortcode. As well you can choose class suffix for different screens by using screen attribute, default is „md“.

Parameters

  • title
  • margin : true / false
  • size : 1 – 12 (grid)
  • screen : xs / sm / md / lg (grid)
[row][col size="6" screen="sm"] 1/2 Phasellus vulputate ac... [/col][col size="6" screen="sm"] 1/2 Phasellus vulputate ac... [/col][/row][row][col size="4" screen="sm"] 1/3 Phasellus vulputate ac... [/col][col size="4" screen="sm"] 1/3 Phasellus vulputate ac... [/col][col size="4" screen="sm"] 1/3 Phasellus vulputate ac... [/col][/row][row][col size="3" screen="sm"] 1/4 Phasellus vulputate ac... [/col][col size="3" screen="sm"] 1/4 Phasellus vulputate ac... [/col][col size="3" screen="sm"] 1/4 Phasellus vulputate ac... [/col][col size="3" screen="sm"] 1/4  Phasellus vulputate ac... [/col][/row]
1/2
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
1/2
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
1/3
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
1/3
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
1/3
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
1/4
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
1/4
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
1/4
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
1/4
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.

Table

This shortcode allows you to display Pricing Table.

Parameters

  • width : table width in PX or %
  • size : cell(s) width in PX or % (coma separated)
  • head : true / false (table heading display)
  • fixed : true / false (table fixed layout)
  • center : true / false (table text align center)
[table width="100%" head="true"]
Your title | ipsum | dolor | sit
content | lorem | ipsum | dolor
sit | amet | consectetur | adipiscing
tempus | lacinia | scelerisque | porttitor
laoreet | ultricies | diam | eget
arcu | molestie | dapibus | sollicitudin
[/table]
Your titleipsumdolorsit
contentloremipsumdolor
sitametconsecteturadipiscing
tempuslaciniascelerisqueporttitor
laoreetultriciesdiameget
arcumolestiedapibussollicitudin

Google Map

This shortcode allows you to display Google Map.

Parameters

  • address
  • latitude : number
  • longitutde : number
  • width: PX or %
  • height: PX or %
  • enablescrollwheel: true / false
  • disablecontrols: ture / false
  • zoom : 0 – 23
  • tooltip : disable / tooltip text
[map address="New York City"]
Musíte zadať platnú adresu alebo súradnice (1)

Headline

This shortcode allows you to display headline with effect.

Parameters

  • subtitle
  • class : custom css class
  • style : custom css styles
[headline subtitle="reliability, experience, effectiveness"] Lorem ipsum dolor sit amet: [/headline]

Lorem ipsum dolor sit amet:reliabilityexperienceeffectiveness

Icontext

This shortcode allows you to display text with Font Awesome icon and link.

Parameters

  • title
  • icon : font Awesome class
  • link : URL with http://
[icontext link="#" title="Lorem ipsum dolor sit amet" icon="fa-coffee"] Lorem ipsum dolor... [/icontext]
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore.

Readmore

This shortcode allows you to display text readmore button.

Parameters

  • icon : font Awesome class
  • link : URL with http://
  • type : large
[readmore link="#" icon="fa-arrow-right"] Lorem ipsum dolor [/readmore]

Pricing

This shortcode allows you to display pricing table.

Parameters

  • img : URL to image with http://
  • title
  • price
  • before_price
  • after_price
  • sub
  • button_name
  • url : URL with http://
  • highlight : true / false
  • class : custom css class
[pricing title="LOREM" price="49" before_price="$" subtitle="Lorem ipsum" button_name="buy now!" button_url="#" ]
Lorem ipsum dolor sit amet | Consectetur adipiscing elit | Lorem ipsum dolor sit amet
[/pricing]
$49
LOREM
Lorem ipsum
  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Lorem ipsum dolor sit amet

Font Awesome

This shortcode allows you to display Font Awesome icon.

Parameters

  • class : font Awesome class
[fa] fa-user fa-3x [/fa]

Counter

This shortcode allows you to display counters.

Parameters

  • icon : font Awesome class
  • size : font size
  • number
  • unit
  • link : URL with http://
  • title
[counter number="24" unit="K" title="COFFEES"]
0K
COFFEES

Kontakt na inštitúcie


Stránka ministerstva školstva:
https://www.ucimenadialku.sk/kontakt/
info@ucimenadialku.sk
Poradenské call centrum rezortu školstva

0800 138 033  (v pracovné dni  od 8:00 do 16:00)
————————————————

https://vudpap.sk/kontakty/
Pre rodičov, ich deti a pedagogických zamestnancov: koronavirus@vudpap.sk (nonstop)

Pre rodičov, ktorí akútne potrebujú podporu psychológa: 02 4488 1649 (pracovné dni od 9:30 do 14:30)

Bezplatná zelená VÚDPaP linka: 0800 864 883 (pracovné dni od 9:00-18:00)

Pre odbornú verejnosť – zamestnancov i riaditeľov CPPPaP a ČSPP: 0910 186 627 (pracovné dni od 9:00 do 17:00)

Zastavme násilie

https://www.zastavmenasilie.gov.sk/poradna/

Bezplatná NON-STOP linka: 0800 212 212

Ďalšie linky

LINKA DÔVERY NEZÁBUDKA (Liga za dusevne zdravie)

Tel: 0800 800 566

www.dusevnezdravie.sk


Andreas (iba v téme autizmus)

www.andreas.sk

Na telefóne +421 908 767 565 sme k dispozícii každý deň medzi 12:00 a 13:30


Dobrá Linka (Psychologická internetová poradňa pre mladých ľudí so zdravotným znevýhodnením)

#dobrálinka


Linka detskej istoty (LDI) /nonstop/

116 111

http://www.ldi.sk/


Modrý anjel

www.modryanjel.sk

Inštitút psychoterapie a socioterapie

Telefón: 02/44 880 163

https://www.socioterapia.sk/kontakt/

Skúste aj…


Linka dôvery /nonstop/

055/ 622 2323

Linka pre ženy zažívajúce násilie v intímnych vzťahoch

0800 212 212

 

Linka nádeje /nonstop/

055/ 644 1155

 

Linka detskej dôvery

0907 401 749

(Každý pracovný deň od 14:00 do 20:00 hod.)

 

Sociálno-právna poradňa LDI/Ambulantné krízové stredisko LDI

0800 500 500

(Štvrtok a sobotu od 14:00 – 20:00 hod.)

 

Hore
V Blízkosti Offcanvas Bočný Panel