Webboard

Pełna wersja: Dodanie buttonów jak tutaj na forum
Aktualnie przeglądasz uproszczoną wersję forum. Kliknij tutaj, by zobaczyć wersję z pełnym formatowaniem.
Stron: 1 2
Witam, chciałbym dodać buttony (nie koniecznie takie same) jak tutaj na forum czyli jak wpiszę: 
Kod:
[szukaj]

wyskakuje mi takie coś: jest jakiś poradnik na to? Jeśli był już taki temat to przepraszam :)
ale gdzie to chcesz dodac?
W ACP > Konfiguracja > MyCode > Nowe MyCode i tam robisz takie właśnie przyciski
a co to za sztuka zrobić mycode xD?
ACP -> konfiguracja -> MyCode
Tytuł (wymysl cos)
Krótki opis (wymysl cos)
Wyrażenie regularne np.
Kod:
\[szukaj]

Zamiana
Kod:
<div class="button szukaj"><a href="link">button ala mybboard</a></div>

i w global.css
Kod:
.szukaj a {
    background:seagreen;
    color:#fff;
}

.szukaj a:hover{
    background:#1F7143;
}

.button a{
    font-size:17px;
    width:60%;
    padding:15px;
    margin:15px auto;
    display:block;
    border-radius:3px;
    text-align:center;
}

.button i{
    font-size:25px;
    margin:0 10px 0 0;
    vertical-align:middle;
}
style ukradłem to z mybboard.pl mam nadzieje ze się nie wkurzycie xD (nie chciało mi się pisać od podstaw)


dodatkowo możesz dodać ikonke np. lupa z tej stronki http://fortawesome.github.io/Font-Awesome/icons/

czyli zmiana będzie wyglądała tak:
Kod:
<div class="button szukaj"><a href="link"><i class="fa fa-thumbs-o-up"></i>button ala mybboard</a></div>
[Obrazek: d6ky6x.jpg]
Nie działa. CSS wkleiłem :p xD
Edit: Działa ;) Dzięki :D wszystkim, a zwłaszcza
Coś źle robisz. http://scr.hu/78l2/glj67
(25.01.2016, 16:18)GiboneKPL napisał(a): [ -> ]<div class="button szukaj"><a href="link"><i class="fa fa-thumbs-o-up"></i>button ala mybboard</a></div>
Już wszystko działa, dzięki Wam :)
temat dotyczący mybb w HP?
Nie wiedziałem, czy dodać to do Pluginów czy do stylów, grafiki ;)
no pluginów to nie dotyczy, to tylko Style, szablony i grafika
Dodam jeszcze coś od siebie.
Jeśli chcesz te ikonki obok tekstu to robisz tak
Kod:
<a><i class="fa"></i>tekst</a>

a w css'ach
Kod:
i::before{content:""}
.fa{font-family:FontAwesome;margin-right:25px;display:inline-block}

Czcionkę to masz tutaj
https://fortawesome.github.io/Font-Awesome/
a kod podebrany z tej strony na importa wygląda tak
Kod:
@font-face {
   font-family: "FontAwesome";
   font-style: normal;
   font-weight: normal;
   src: url("../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0") format("embedded-opentype"), url("../fonts/fontawesome-webfont.woff2?v=4.3.0") format("woff2"), url("../fonts/fontawesome-webfont.woff?v=4.3.0") format("woff"), url("../fonts/fontawesome-webfont.ttf?v=4.3.0") format("truetype"), url("../fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular") format("svg");
Wiadomo możesz sobie wszystko poprzestawiać do swoich potrzeb tak jak tutaj font-size jest na 25px :D
Też fajnie :D Dzięki :)
ooo nawet nie wiedziałem że można zaznaczać kilka najlepszych odpowiedzi :D
 niestety z tym co podałeś jest pewien problem
mianowicie ten kod do css
Kod:
i::before{content:""}
.fa{font-family:FontAwesome;margin-right:25px;display:inline-block}

po uzyciu jego, wszystkie fonty z https://fortawesome.github.io/Font-Awesome/ będą przesunięte w lewo o 25px
wszystkie z klasą .fa
Jakiś z tym problem?
Ja widzę inny jak będzie znacznik <i> to zawsze wstawi .
Trzeba tutaj jakąś klasę pewno zastosować aby to lepiej działało.
Stron: 1 2