Jednym z podstawowych założeń nowego Edenu było zapewnienie Wam bezpieczeństwa. Dlatego właśnie, ceniąc sobie komfort użytkowników nade wszystko oraz chcąc umożliwić Wam korzystanie z kodów HTML na Edenie, od dnia dzisiejszego możecie robić to za pomocą... BBcodów!
Ten poradnik krok po kroku pokaże Wam, jak korzystać z udostępnionych przez nas możliwości i jak uratować kody, które obecnie nie działają.
Na potrzeby przeprowadzenia instruktażu przygotowaliśmy przykładowy kod.
Kod: Zaznacz cały
<style>
.tlo{
width:400px;
height:500px;
padding:10px;
background-color:#ccc;
}
.tytul{
font-family:raleway;
font-size:30px;
text-transform:uppercase;
letter-spacing:2px;
line-height:1.4;
}
.tresc{
background-color:rgba(255,255,255,0.5);
width:80%;
margin:10px 0px;
padding:15px;
color:#000;
font-family:arial;
text-align:justify;
height:300px;
overflow:auto;
font-size:13px;
margin: 0 auto;
margin-bottom: 10px;
}
.tlo img{
width:45%
}
</style>
<center>
<div class="tlo">
<div class="tytul">
Jestem tytułem
</div>
<div class="tresc">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum varius urna a diam hendrerit convallis. Integer sit amet pellentesque enim. Donec lacinia lectus eu sodales finibus. Phasellus placerat lorem et magna fringilla vehicula. Morbi volutpat turpis ac tincidunt iaculis. Vestibulum non risus at nibh sodales tincidunt ut vitae lacus. Etiam et neque sit amet velit pharetra rutrum.
Integer vehicula ex et tortor ullamcorper sodales. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse bibendum placerat erat quis varius. Aliquam convallis nunc ut risus fringilla, in suscipit turpis aliquet. In mollis mauris eu neque pulvinar posuere. Suspendisse vitae nisl porttitor, congue neque vel, viverra velit. Suspendisse id placerat dolor, vitae pulvinar erat. Sed magna felis, interdum condimentum lobortis eu, finibus non ex. Phasellus blandit vel orci gravida eleifend. Cras non iaculis neque. Aenean interdum risus ac libero euismod, sed commodo justo tristique.
Nulla elementum massa at leo sodales varius. Fusce a tortor enim. Mauris lectus leo, lacinia auctor luctus sit amet, vehicula vitae leo. Sed varius nulla id ullamcorper posuere. Sed luctus erat eros, sed consectetur risus tempus eget. Pellentesque pellentesque urna turpis, a suscipit lacus aliquam sit amet. Nunc at dolor egestas, sagittis dui vel, facilisis mi. Suspendisse malesuada a lacus sed blandit. Ut vehicula nunc non facilisis consequat. Praesent interdum tincidunt vulputate. In aliquet interdum ex, sit amet lobortis metus sagittis id. Praesent efficitur ex eu purus varius, vitae lobortis metus congue. Donec eu nisl at turpis interdum auctor ac mollis massa. Morbi luctus euismod scelerisque. Sed vel nunc diam. In at auctor nisl.
Donec vehicula libero id lorem gravida, at sodales nisi finibus. Etiam vitae mollis quam, ut pellentesque orci. Fusce pharetra lacus sed sapien accumsan, vitae mattis arcu rhoncus. Aliquam erat volutpat. Etiam accumsan fermentum mauris sit amet gravida. Nulla facilisi. Ut id porttitor metus, at dapibus diam. Ut sed mollis orci. Donec in rutrum sapien. Pellentesque metus turpis, facilisis ac sapien ut, ullamcorper scelerisque dolor. Aenean in nisl tincidunt, commodo urna ac, convallis tellus. Morbi ut commodo felis, ac tristique est.
Vestibulum mattis nisl in lectus varius ullamcorper id at lacus. Nunc interdum ligula ligula. Sed vestibulum eu erat eu maximus. Morbi tempor, erat eget dignissim elementum, magna dolor auctor nisl, vel volutpat mauris eros aliquet nisl. Cras finibus feugiat augue, at laoreet nisl ultricies non. Phasellus eleifend ex vitae ultricies pharetra. Duis eu arcu non velit interdum scelerisque id nec odio.
</div>
<img src="https://media.giphy.com/media/JI2HICt36nqta/giphy.gif">
<img src="https://media.giphy.com/media/JI2HICt36nqta/giphy.gif">
</div>
</center>
Teraz - wspólnie - zbudujemy ten sam kod w BBcodzie dostępnym na Edenie!
Zaczniemy od zewnętrznego elementu blokowego.
Kod: Zaznacz cały
<center>
<div class="tlo">
TREŚĆ
</div>
</center>
<style>
.tlo{
width:400px;
height:500px;
padding:10px;
background-color:#ccc;
}
</style>Obecnie nasz kod prezentował się będzie w ten sposób:
Kod: Zaznacz cały
[center]
[divclass="tlo"]TREŚĆ[/divclass]
[/center]
[style=".tlo"]width:400px;height:500px;padding:10px;background-color:#ccc;[/style]Kod: Zaznacz cały
[center]
[divclass="tlo"]
[divclass="tytul"]JESTEM TYTUŁEM[/divclass]
[/divclass]
[/center]
[style=".tlo"]width:400px;height:500px;padding:10px;background-color:#ccc;[/style]
[style=.tytul]font-family:raleway;font-size:30px;text-transform:uppercase;letter-spacing:2px;line-height:1.4;[/style]Kod: Zaznacz cały
[googlefont]Raleway[/googlefont]Kod: Zaznacz cały
[center]
[divclass="tlo"]
[divclass="tytul"]JESTEM TYTUŁEM[/divclass]
[/divclass]
[/center]
[style=".tlo"]width:400px;height:500px;padding:10px;background-color:#ccc;[/style]
[style=.tytul]font-family:raleway;font-size:30px;text-transform:uppercase;letter-spacing:2px;line-height:1.4;[/style]
[googlefont]Raleway[/googlefont]Kod: Zaznacz cały
[center]
[divclass="tlo"]
[divclass="tytul"]JESTEM TYTUŁEM[/divclass]
[divclass="tresc"]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum varius urna a diam hendrerit convallis. Integer sit amet pellentesque enim. Donec lacinia lectus eu sodales finibus. Phasellus placerat lorem et magna fringilla vehicula. Morbi volutpat turpis ac tincidunt iaculis. Vestibulum non risus at nibh sodales tincidunt ut vitae lacus. Etiam et neque sit amet velit pharetra rutrum.
Integer vehicula ex et tortor ullamcorper sodales. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse bibendum placerat erat quis varius. Aliquam convallis nunc ut risus fringilla, in suscipit turpis aliquet. In mollis mauris eu neque pulvinar posuere. Suspendisse vitae nisl porttitor, congue neque vel, viverra velit. Suspendisse id placerat dolor, vitae pulvinar erat. Sed magna felis, interdum condimentum lobortis eu, finibus non ex. Phasellus blandit vel orci gravida eleifend. Cras non iaculis neque. Aenean interdum risus ac libero euismod, sed commodo justo tristique.
Nulla elementum massa at leo sodales varius. Fusce a tortor enim. Mauris lectus leo, lacinia auctor luctus sit amet, vehicula vitae leo. Sed varius nulla id ullamcorper posuere. Sed luctus erat eros, sed consectetur risus tempus eget. Pellentesque pellentesque urna turpis, a suscipit lacus aliquam sit amet. Nunc at dolor egestas, sagittis dui vel, facilisis mi. Suspendisse malesuada a lacus sed blandit. Ut vehicula nunc non facilisis consequat. Praesent interdum tincidunt vulputate. In aliquet interdum ex, sit amet lobortis metus sagittis id. Praesent efficitur ex eu purus varius, vitae lobortis metus congue. Donec eu nisl at turpis interdum auctor ac mollis massa. Morbi luctus euismod scelerisque. Sed vel nunc diam. In at auctor nisl.
Donec vehicula libero id lorem gravida, at sodales nisi finibus. Etiam vitae mollis quam, ut pellentesque orci. Fusce pharetra lacus sed sapien accumsan, vitae mattis arcu rhoncus. Aliquam erat volutpat. Etiam accumsan fermentum mauris sit amet gravida. Nulla facilisi. Ut id porttitor metus, at dapibus diam. Ut sed mollis orci. Donec in rutrum sapien. Pellentesque metus turpis, facilisis ac sapien ut, ullamcorper scelerisque dolor. Aenean in nisl tincidunt, commodo urna ac, convallis tellus. Morbi ut commodo felis, ac tristique est.
Vestibulum mattis nisl in lectus varius ullamcorper id at lacus. Nunc interdum ligula ligula. Sed vestibulum eu erat eu maximus. Morbi tempor, erat eget dignissim elementum, magna dolor auctor nisl, vel volutpat mauris eros aliquet nisl. Cras finibus feugiat augue, at laoreet nisl ultricies non. Phasellus eleifend ex vitae ultricies pharetra. Duis eu arcu non velit interdum scelerisque id nec odio.
[/divclass]
[/divclass]
[/center]
[style=".tlo"]width:400px;height:500px;padding:10px;background-color:#ccc;[/style]
[style=.tytul]font-family:raleway;font-size:30px;text-transform:uppercase;letter-spacing:2px;line-height:1.4;[/style]
[style=".tresc"]background-color:rgba(255,255,255,0.5);width:80%;margin:10px 0px;padding:15px;color:#000;font-family:arial;text-align:justify;height:300px;overflow:auto;font-size:13px;margin: 0 auto;margin-bottom: 10px;[/style]
[googlefont]Raleway[/googlefont]Ostatnią częścią jest dorzucenie dwóch obrazków na samym końcu. Należy zauważyć, że BBcode nie umożliwia nadania znacznikowi img klasy. Co za tym idzie, należy użyć klasy elementu, w którym znajduje się obrazek. Gotowy kod prezentuje się w następujący sposób:
Kod: Zaznacz cały
[center]
[divclass="tlo"]
[divclass="tytul"]JESTEM TYTUŁEM[/divclass]
[divclass="tresc"]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum varius urna a diam hendrerit convallis. Integer sit amet pellentesque enim. Donec lacinia lectus eu sodales finibus. Phasellus placerat lorem et magna fringilla vehicula. Morbi volutpat turpis ac tincidunt iaculis. Vestibulum non risus at nibh sodales tincidunt ut vitae lacus. Etiam et neque sit amet velit pharetra rutrum.
Integer vehicula ex et tortor ullamcorper sodales. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse bibendum placerat erat quis varius. Aliquam convallis nunc ut risus fringilla, in suscipit turpis aliquet. In mollis mauris eu neque pulvinar posuere. Suspendisse vitae nisl porttitor, congue neque vel, viverra velit. Suspendisse id placerat dolor, vitae pulvinar erat. Sed magna felis, interdum condimentum lobortis eu, finibus non ex. Phasellus blandit vel orci gravida eleifend. Cras non iaculis neque. Aenean interdum risus ac libero euismod, sed commodo justo tristique.
Nulla elementum massa at leo sodales varius. Fusce a tortor enim. Mauris lectus leo, lacinia auctor luctus sit amet, vehicula vitae leo. Sed varius nulla id ullamcorper posuere. Sed luctus erat eros, sed consectetur risus tempus eget. Pellentesque pellentesque urna turpis, a suscipit lacus aliquam sit amet. Nunc at dolor egestas, sagittis dui vel, facilisis mi. Suspendisse malesuada a lacus sed blandit. Ut vehicula nunc non facilisis consequat. Praesent interdum tincidunt vulputate. In aliquet interdum ex, sit amet lobortis metus sagittis id. Praesent efficitur ex eu purus varius, vitae lobortis metus congue. Donec eu nisl at turpis interdum auctor ac mollis massa. Morbi luctus euismod scelerisque. Sed vel nunc diam. In at auctor nisl.
Donec vehicula libero id lorem gravida, at sodales nisi finibus. Etiam vitae mollis quam, ut pellentesque orci. Fusce pharetra lacus sed sapien accumsan, vitae mattis arcu rhoncus. Aliquam erat volutpat. Etiam accumsan fermentum mauris sit amet gravida. Nulla facilisi. Ut id porttitor metus, at dapibus diam. Ut sed mollis orci. Donec in rutrum sapien. Pellentesque metus turpis, facilisis ac sapien ut, ullamcorper scelerisque dolor. Aenean in nisl tincidunt, commodo urna ac, convallis tellus. Morbi ut commodo felis, ac tristique est.
Vestibulum mattis nisl in lectus varius ullamcorper id at lacus. Nunc interdum ligula ligula. Sed vestibulum eu erat eu maximus. Morbi tempor, erat eget dignissim elementum, magna dolor auctor nisl, vel volutpat mauris eros aliquet nisl. Cras finibus feugiat augue, at laoreet nisl ultricies non. Phasellus eleifend ex vitae ultricies pharetra. Duis eu arcu non velit interdum scelerisque id nec odio.
[/divclass]
[img]https://media.giphy.com/media/JI2HICt36nqta/giphy.gif[/img] [img]https://media.giphy.com/media/JI2HICt36nqta/giphy.gif[/img]
[/divclass]
[/center]
[style=".tlo"]width:400px;height:500px;padding:10px;background-color:#ccc;[/style]
[style=".tlo img"]width:45%[/style]
[style=.tytul]font-family:raleway;font-size:30px;text-transform:uppercase;letter-spacing:2px;line-height:1.4;[/style]
[style=".tresc"]background-color:rgba(255,255,255,0.5);width:80%;margin:10px 0px;padding:15px;color:#000;font-family:arial;text-align:justify;height:300px;overflow:auto;font-size:13px;margin: 0 auto;margin-bottom: 10px;[/style]
[googlefont]Raleway[/googlefont]JESTEM TYTUŁEM
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum varius urna a diam hendrerit convallis. Integer sit amet pellentesque enim. Donec lacinia lectus eu sodales finibus. Phasellus placerat lorem et magna fringilla vehicula. Morbi volutpat turpis ac tincidunt iaculis. Vestibulum non risus at nibh sodales tincidunt ut vitae lacus. Etiam et neque sit amet velit pharetra rutrum.
Integer vehicula ex et tortor ullamcorper sodales. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse bibendum placerat erat quis varius. Aliquam convallis nunc ut risus fringilla, in suscipit turpis aliquet. In mollis mauris eu neque pulvinar posuere. Suspendisse vitae nisl porttitor, congue neque vel, viverra velit. Suspendisse id placerat dolor, vitae pulvinar erat. Sed magna felis, interdum condimentum lobortis eu, finibus non ex. Phasellus blandit vel orci gravida eleifend. Cras non iaculis neque. Aenean interdum risus ac libero euismod, sed commodo justo tristique.
Nulla elementum massa at leo sodales varius. Fusce a tortor enim. Mauris lectus leo, lacinia auctor luctus sit amet, vehicula vitae leo. Sed varius nulla id ullamcorper posuere. Sed luctus erat eros, sed consectetur risus tempus eget. Pellentesque pellentesque urna turpis, a suscipit lacus aliquam sit amet. Nunc at dolor egestas, sagittis dui vel, facilisis mi. Suspendisse malesuada a lacus sed blandit. Ut vehicula nunc non facilisis consequat. Praesent interdum tincidunt vulputate. In aliquet interdum ex, sit amet lobortis metus sagittis id. Praesent efficitur ex eu purus varius, vitae lobortis metus congue. Donec eu nisl at turpis interdum auctor ac mollis massa. Morbi luctus euismod scelerisque. Sed vel nunc diam. In at auctor nisl.
Donec vehicula libero id lorem gravida, at sodales nisi finibus. Etiam vitae mollis quam, ut pellentesque orci. Fusce pharetra lacus sed sapien accumsan, vitae mattis arcu rhoncus. Aliquam erat volutpat. Etiam accumsan fermentum mauris sit amet gravida. Nulla facilisi. Ut id porttitor metus, at dapibus diam. Ut sed mollis orci. Donec in rutrum sapien. Pellentesque metus turpis, facilisis ac sapien ut, ullamcorper scelerisque dolor. Aenean in nisl tincidunt, commodo urna ac, convallis tellus. Morbi ut commodo felis, ac tristique est.
Vestibulum mattis nisl in lectus varius ullamcorper id at lacus. Nunc interdum ligula ligula. Sed vestibulum eu erat eu maximus. Morbi tempor, erat eget dignissim elementum, magna dolor auctor nisl, vel volutpat mauris eros aliquet nisl. Cras finibus feugiat augue, at laoreet nisl ultricies non. Phasellus eleifend ex vitae ultricies pharetra. Duis eu arcu non velit interdum scelerisque id nec odio.
Integer vehicula ex et tortor ullamcorper sodales. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse bibendum placerat erat quis varius. Aliquam convallis nunc ut risus fringilla, in suscipit turpis aliquet. In mollis mauris eu neque pulvinar posuere. Suspendisse vitae nisl porttitor, congue neque vel, viverra velit. Suspendisse id placerat dolor, vitae pulvinar erat. Sed magna felis, interdum condimentum lobortis eu, finibus non ex. Phasellus blandit vel orci gravida eleifend. Cras non iaculis neque. Aenean interdum risus ac libero euismod, sed commodo justo tristique.
Nulla elementum massa at leo sodales varius. Fusce a tortor enim. Mauris lectus leo, lacinia auctor luctus sit amet, vehicula vitae leo. Sed varius nulla id ullamcorper posuere. Sed luctus erat eros, sed consectetur risus tempus eget. Pellentesque pellentesque urna turpis, a suscipit lacus aliquam sit amet. Nunc at dolor egestas, sagittis dui vel, facilisis mi. Suspendisse malesuada a lacus sed blandit. Ut vehicula nunc non facilisis consequat. Praesent interdum tincidunt vulputate. In aliquet interdum ex, sit amet lobortis metus sagittis id. Praesent efficitur ex eu purus varius, vitae lobortis metus congue. Donec eu nisl at turpis interdum auctor ac mollis massa. Morbi luctus euismod scelerisque. Sed vel nunc diam. In at auctor nisl.
Donec vehicula libero id lorem gravida, at sodales nisi finibus. Etiam vitae mollis quam, ut pellentesque orci. Fusce pharetra lacus sed sapien accumsan, vitae mattis arcu rhoncus. Aliquam erat volutpat. Etiam accumsan fermentum mauris sit amet gravida. Nulla facilisi. Ut id porttitor metus, at dapibus diam. Ut sed mollis orci. Donec in rutrum sapien. Pellentesque metus turpis, facilisis ac sapien ut, ullamcorper scelerisque dolor. Aenean in nisl tincidunt, commodo urna ac, convallis tellus. Morbi ut commodo felis, ac tristique est.
Vestibulum mattis nisl in lectus varius ullamcorper id at lacus. Nunc interdum ligula ligula. Sed vestibulum eu erat eu maximus. Morbi tempor, erat eget dignissim elementum, magna dolor auctor nisl, vel volutpat mauris eros aliquet nisl. Cras finibus feugiat augue, at laoreet nisl ultricies non. Phasellus eleifend ex vitae ultricies pharetra. Duis eu arcu non velit interdum scelerisque id nec odio.
