Jogger.pl

Przyciski formatowania wpisu HTML-em

Panel AdministracyjnyWpisy 16 lipca 2006

Dodałem dość solidnie zmodyfikowany i „przepisany na standardy” skrypt Quicktags do pola dodawania / edytowania wpisu. Dodatkowe tagi są pokazywane na ciasteczkach i jest ich dość dużo, aby zadowolić każdego. Enjoy.

--Riddle

Trackback | Dodaj komentarz

Komentarze RSS

  1. Dzięki Riddle,
    przyda się bardzo...

  2. ...normalny wodotrysk ;)

  3. Nie znam się, ale guzika do dodawania taba dałoby się tam dorobić jeszcze?

  4. Da się, ale to później dzisiaj / jutro. Na razie korzystaj z na przykład li - wstawia tabulator przed.

    ...: Ty byś się ucieszyła, jakby wstawiało od razu na czerwono coś, co? ;-)

  5. Trochę głupio rozwiązania kwestia zamykania, można krzyżować bez problemu. Lepiej byłoby, gdyby nie pozwalał zamykać w dowolnej kolejności.

  6. ...ja się w ogóle mało cieszę, Riddlu...
    ...a w kwestii wstawiania liczę na siebie bardziej niż wspomagacze, z kórych zresztą połowy conajmniej (dzięki specyficznemu slangowi objaśnień, of course) nie rozumiem... nie dziwię się, o nie! ..to w końcu elitarny jogger, a ja się ino błąkam po obrzeżach tego świata ;)

  7. Michał: LOL, to nie Tidy, mate. ;D

    ...: Przesuń mychą nad przyciski i zobaczysz opis tekstowy. :)
    Dodatkowo może naskrobię opis w Wiki co poszególny przycisk wstawia i dodam tam link Pomocy.

  8. ...akurat o tym opisie ciut wyżej napisałam, że taki zrozumiały dla niekumatych ogólnie ;P

  9. A dobra, to się uczepię, że listy zagnieżdzać nie można.

  10. kbd, samp, var - nie maja 'tłumaczenia' w dymkach :P

  11. A co, podejmujesz się je opisać w 2, 3 wyrazach? Ja nie jestem taki pewny siebie. :P Kto wie jak stoją sprawy z ich semantyką ten używa, proste. ;)

  12. A kiedy dodasz TinyMCE? :-)

  13. Znaczy WYSIWYG? Żadnych WYSIWYG-ów! :P

  14. :-(

    Nawet opcjonalnie?

  15. Się zobaczy… ale to już ze Sparrowem musiałbym współpracować nad tym bajerem.

    Poza tym też chodzi o czas, chęci… ;)

  16. kbd - Skrót klawiaturowy

    Reszta nie mam pojęcia do czego jest. :)

  17. Sznik, właśnie że nie. :) Kbd oznacza dane wprowadzane za pomocą klawiatury. Może to być skrót klawiaturowy w naciąganej definicji, może to być też coś innego.
    http://grabun.com/teksty/zapomniane-znaczniki/

    Przeczytaj sobie :P

  18. Brawo Riddle. :)

  19. A czemu nie zablokowałeś komentarzy?

  20. "<span style="text-decoration: underline" />"? A nie ma przypadkiem czegoś takiego jak "<u />" …?

  21. Ja mam takie pytanie i żądam *poważnej* odpowiedzi na nie - dlaczego w Operze tego nie ma?

  22. Siergiej: SOA#1

  23. Kikuchi: <u /> się nie powinno stosować.

    ps. czemu tego paska nie ma w szkicach?

  24. ehh: O, no proszę — człowiek uczy się każdego dnia. :) A mógłbyś zarzucić jakimś linkiem bądź wytłumaczyć, czemu się nie powinno? :-)

  25. "Podkreślenie czcionki zostało zachowane jeszcze w specyfikacji XHTML 1.0, ale wycofane ze specyfikacji XHTML 1.1."

    -- http://webmaster.helion.pl/kurshtml/czcionka/czcionka.htm#under

    Jak nie wierzysz to porównaj sobię specyfikację:)

  26. Przydałoby się jeszcze bbcode, a najlepiej do wyboru dla komentarzy:
    * Zwykły tekst
    * bbcode
    * markdown

  27. Siergiej - o co kaman?

  28. @Siergiej: C-r albo czyść cache.

  29. Czy można brejka dać do pierwszej, najczęsciej uzywanej linii?
    Poproszę.

  30. A czy auto zamiana NL na <BR> jest możliwa ? Strasznie to irytujące... może być jako opcja....

  31. Lepiej nie zamieniać automatycznie, bo czasem lubię sobie w nowej linii coś dać dla wygody wizualnej przy pisaniu.
    Poza tym <br /> nie powinien być zbyt często stosowany. Najczęściej wystraczy <p></p>.

  32. danke schoen

  33. Sorry, nie czytałem tych 30 komentarzy - będzie możliwość dodawania własnych?

  34. another: na razie nie, to tylko hack w JS a nie nowa funkcjonalność, jaką by było generowanie quicktabs.js na podstawie ustawień w joggerze.

  35. Z reakcji tłumu wnioskuje że tylko u mnie są problemy, ale czyszczenie cache nie pomaga. Konsola JS zwraca mi to:
    JavaScript - https://login.jogger.pl/?tab=add_entry
    Inline script thread
    Error:
    name: ReferenceError
    message: Statement on line 1: Reference to undefined variable: edToolbar
    Backtrace:
    Line 1 of inline#1 script in https://login.jogger.pl/?tab=add_entry
    var edCanvas = document.getElementById("body");
    edToolbar();

  36. Opera, tak? Numerek wersji? 5.0? ;)

  37. Ha ha - kiepski jołk rid. 9.01.387

  38. @Siergiej:
    Sprawdź, czy w źródle strony masz:
    <script src="themes/riddle/quicktags.js" type="text/javascript"></script>

    Jak nie, to coś z cache masz.

  39. Specjalnie dla Ciebie odpaliłem Operę 9 i stronę na moim serwerze jak i gotowy panel joggera - działa. Szukaj - wina leży po stronie Twojego oprogramowania / komputera / whatever.

  40. Jest.

  41. Wyłącz Adblockery, UserJSy i inne rzeczy ingerujące w kod strony.

  42. U mnie w operze 9 też wszystko działa.

  43. @Siergiej:
    Wejdź bezpośrednio na https://login.jogger.pl/themes/riddle/quicktags.js i odśwież.

  44. @Peres: Pomogło! Dzięki!

  45. Operowe cache, tia. :-)

    Ustosunkuję się jeszcze do prośby Siwej - zmiana tych przycisków to albo tak jak prosił Gopix albo przez UserJS. Do tego br naprawdę nie jest często używany - jeśli pisze się korzystając z akapitów to bardzo rzadko.

  46. Nie każdy korzysta z akapitów.
    Zresztą po co takie udogodnienia? Zapewne więcej czasu zajmie złapanie myszki i kliknięcie, niż napisanie <znacznik> i </znacznik>.

  47. Dzięki Riddle za pomoc. Pozostanę zatem przy pisaniu z komunikatora, panel dodawania wpisów jest tradycyjnie bezużyteczny.
    Niestety nie mam pojęcia czym jest UserJSy, nie korzystam z <p> i nie klepię znaczników z palca.

  48. Oczywiście opcja standardowa - posiadanie zwiększonego panelu znaczników uraża Twoją dumę. Rozumiem.

    omg: Trollujesz

  49. Nie trzymam dumy w panelu. Sugeruję, że dzogerem posługują się też osoby niezajmujące się zaawansoanymi technologiami, a brejk to PODSTAWOWY znacznik, jak enter na klawiaturze.

  50. Podstawowym znacznikiem jest a albo b - br to kwestia dyskusyjna. Na przykład ja w każdym wpisie oraz wielu innych userów Jogger.pl używamy code - i co, ma to być znacznik podstawowy? Do rozdzielania akapitów służy p i marginesy. Tak, dlatego też rozdzieliłem b / strong & i / em - jest możliwość nauczenia paru osób więcej różnicy i bardzo dobrze. Br to relikt i nie zależy mi (ani każdej logicznie myślącej osobie), żeby więcej osób używało tej niesemantycznej encji znacznikowej. EoT z mojej strony, zawsze możesz rozwinąć panel tagów.

  51. Gdzieś czytałam, że jesteś entuzjastą wyłącznie swojej wizji świata. Trudno.

  52. Nie rozumiem Twojego problemu. Masz br w dodatkowych znacznikach. Użyj sobie Stylish do Fx albo UserCSS i wyłącz dodatkowe przyciski via CSS dla login.jogger.pl jeśli pozostałe są TAKIM problemem. :S

  53. Ale naprawdę <br /> to relikt (a <BR> już szczególnie). To jest jak robienie wcięć za pomocą spacji.
    W procesorach tekstu <enter> tworzy nowy akapit czyli jakby <p></p> właśnie.

  54. Poczytać:
    http://mgorny.jogger.pl/2006/06/26/przestale-ale-wciaz-namietnie-stosowane-elementy-html-a/

    Tam pisałem na temat <br/> i innych świństw trochę szerzej. Może ilość tekstu przemówi do rozsądku.

  55. A umiałby ktoś za pomocą UserJS w operze zrobić skrypt który by dodawał jakiś znacznik? (resztę bym sobie sam dodał jak bym zrozumiał co i jak)

  56. Popieram siwą, bo też używam <br />.
    Bo nowa linijka nie zawsze oznacza nowy akapit.
    Każde zdanie cytowanej rozmowy to nowy akapit ma być? Bezsens. Co prawda mnie to zwisa czy znacznik jest w pierwszej czy w kolejnej linijce, ale oczywiście przyjemniej by było jakby był w pierwszej. Skoro jest tam <u> - podobno też nie zalecane. Co prawda wtedy <hr /> zostanie samotne i rozwali Riddlowi koncepcję układu przycisków, ale mówi się trudno. Może coś wymyśli.
    A w UserJS nie chce mi się bawić...

  57. @lemiel:
    Do cytowania rozmowy proponuję używać <pre/>.

  58. Sorry że się wtrącę ale do cytowania to chyba <blockquote> <q> jest..?

  59. W tym przypadku <blockquote/>+<pre/>. Można alternatywnie w CSS-ie white-space nadać do <blockquote/>, ale <pre/> zapewnia kompatybilność dla przeglądania bez CSS.

  60. lemiel - "u" wcale nie daje <u> ...

  61. bo <u> wypadło ze specyfikacji. To może być mylące... Ja bym zrobił zamiast tego ikonki znane z edytorów typu OOo Writer czy MS Word.I też byłbym za _opcjonalnym_ TinyMCE.

  62. To już nie moja brocha, męczcie nowożeńca ;)

  63. @balbardagram: nie patrzyłem - nie miałem jeszcze potrzeby używać "u" odkąd się te przyciski pojawiły.

    <br/> jest niezalecane/przestarzałe, a w drafcie xhtml 2.0 dodali jeszcze <l> i </l> określające linię tekstu, a mające zastąpić <br/>, ale w starym dokumencie z 2003 (nie szukałem nowszego) jest napisane, że jeszcze dyskutują czy aby na pewno, bo oba znaczniki mogą być potrzebne i nie wiem do jakich wniosków doszli.
    Ktoś wie?

    Edit:
    Znalazłem 7 wersję draftu z maja 2005 i tam nie znalazłem <br/> ale oczywiście <l></l> jest.
    Co prawda ma to marne znaczenie bo xhtml 2.0 nikt raczej nie używa.

    O i widzę że u Peresa jest też o tym <l>. Ale wskazanie na <pre>. Co wymagałoby dodatkowego ostylowania pewnie.

  64. Wybaczcie, jeżeli ta sugestia była, ale 63 komentarzy nie mam teraz czasu przeglądnąć ;)
    a chodzi o to: jak rozwinę listę, to mi ucieka guziczek do jej zwinięcia, a to chyba nie powinno mieć miejsca, guziczek nie powinien się przemieszczać?

  65. Powinien. Tzn jest to zachowanie domyślne.

  66. Powinien mi uciekać? Czyli jak otworzę i zobaczę, że to co otwarłem mnie nie interesuje to powinienem musieć przesunąć wskaźnik myszy, żeby to zamknąć?
    Elementy UI (chyba można ten guzik pod to podciągnąć) nie powinny się przemieszczać, jakoś nigdzie przyciski do expandowania czegoś nie uciekają mi spod kursora.

  67. Dobrze jest teraz jak jest, są wszystkie potrzebne znaczniki i lepiej imo jest jak są ładnie opisane, a nie jakieś obrazeczki.

  68. To przy okazji można by dodać do tego jeszcze kilka drobiazgów uciążliwych do wpisywania (na nieprzedefiniowanej w Linuksie klawiaturze): &mdash; &nbsp; &#8222; &#8221; &lt; &gt;
    Pomysłów na inne znaczki zabrakło. Może ktoś coś dorzuci?

    A i brakuje jeszcze <dfn>. Ostatnio dużo tutoriali się pojawia na joggerze, to by się autorom przydało.

  69. fajny gadżecik :)
    ja jednak wolę wpisywać bez pomocy przycisków, przyzwyczajenie z kate

    ale mały bug jest: napisalem <p> ( nie klikałem na nic ), kliknąłem na ".../>" i nie zamknął znacznika ;) ale rozumiem, że zamykanie dotyczy tylko znaczników, które zostały wprowadzone z toolbara, nie napisane własnoręcznie

  70. Proponuję także wstawienie tego ficzera w miejscu edycji szkicu.

  71. Zrobiłem sobie quicktags.js z nowymi przyciskami i brakującymi opisami w etykietkach, ale co mi z tego...
    Ponadto nie wiem jak Riddle robił odstępy między grupami przycisków.

  72. Riddle,
    mógłbyś dopisać do tych przycisków przycisk EXCERPT?

  73. A to jest zarąbisty pomysł. :-)

  74. aha i jeszcze jedno,
    mógłbyś wrzucić aby po kliknięciu na utworzenie linku w polu podaj adres docelowy już znajdowało się "http://"?

  75. A jakbym podesłał te nowe przyciski to byś je dodał?

  76. Update gotowy. Dodałem escape znaczków HTML-a, EXCERPT, pytanie o lang dla abbr, acronym oraz cite dla blockquote i dodałem tag linka zewnętrznego. Plus parę nowych zwykłych przycisków (w tym Tab).

  77. i Niech Ci Bóg w dzieciach wynagrodzi... hmm... może jednak nie ;)

  78. Proponowałbym jeszcze dodać te wszystkie przyciski do Edycji Szkiców, bo wersję, którą się często zapisuje najwygodniej jest pisać właśnie w tym menu.

  79. Fajnie, ale te też byłyby fajne i do pisania po polsku.
    Da się jeszcze coś zrobić?

    edButtons.push( new edButton('ed_cuo', 'Cudzys\u0142\u00F3w otwieraj\u0105cy', '\u201E', '&#8822;', '', -1) );
    edButtons.push( new edButton('ed_cuz', 'Cudzys\u0142\u00F3w zamykaj\u0105cy', '\u201F', '&#8821;', '', -1) );
    edButtons.push( new edButton('ed_ndash', 'P\u00F3\u0142pauza', 'ndash', '&ndash;', '', -1) );
    edButtons.push( new edButton('ed_mdash', 'Pauza', 'mdash', '&mdash;', '', -1) );
    edButtons.push( new edButton('ed_nbsp', 'Twarda spacja', 'nbsp', '&nbsp;', '', -1) );

  80. Prawidłowe, do tego prawidłowo zagnieżdzane, cudzysłowia otrzymujesz stosując element <q></q> - nota bene cytat.

    Tamte typograficzne znaczki są dla osób świadomych - a te zrobią sobie tak:
    http://perfectionorvanity.com/2006/01/15/definiowalne-znaki-uzytkownika/

  81. @lemiel:
    Cudzysłowia polskie to &bdquo; i &rdquo;. Nie ma potrzeby podawać kodów. I jeszcze wielokropek — &hellip;, jeśli się nie mylę.

  82. Michał: wiesz, tagi też można z palca wklepać. :-)

  83. @Kiku
    wiesz ja tak od początku joggera pisze w ten sposób, teraz mnie się trudno przestawić

  84. Sterownik klawiatury sobie zróbcie / zainstalujcie… ja nie widzę problemu.

    … „” ‰ § € – —

    etc…

  85. @Riddle: Ale tych nieświadomych można by w ten sposób uświadomić. Poza tym łatwiej kliknąć w przycisk niż redefiniować sobie klawiaturę. Ponadto cytując Ciebie z podanego odnośnika, z podkreśleniem słowa _brakowało_ : W sumie starczało mi to i brakowało na każdym komputerze jaki odwiedzałem.

    @Michał G.: Nie znałem tych skrótów, a jakoś nie mogłem znaleźć, kody było znaleźć dużo łatwiej.

  86. misiekf: Znaczy, że z palca? Ja też raczej nigdy nie korzystam z żadnych przycisków do wstawiania tagów, ale nie myślę tylko o sobie. :-)

    A znaki typu „”… mam pod [alt] + [;], [alt] + ['] i [alt] + [.] ;-)

  87. @Riddle:
    A wyobraź sobie, że sam pisałem sobie układ klawiszy z takimi znaczkami, zarówno dla x.org i tty. Ale mimo wszystko uważam, że po to powstały encje, żeby je stosować i działały niezależnie od kodowania.

  88. Wiesz, można i zrobić skrypt obsługujący sierotki, naprawiający typografię… ale to już po stronie serwera, pewne i sprawdzone. Jak chcesz mieć takie bajery to proszę:
    http://grabun.com/upiekszacz/
    http://grabun.com/sierotki/

  89. W sumie jakby się uprzeć to i krótsze tagi dałoby się pod np [alt] + [ctrl] + [klawisz] powstawiać, jeżeli nie przeszkadzałoby to innym programom. Ew. przełączać klawiaturę. :-)

  90. Panowie, jak już tak szalejemy to może moduł który by umieszczał tekst dzięki analizie głosu mówionego, hę?

  91. @misiekf:
    Takie rzeczy to tylko w Operze.

  92. Wątek śledzi jakieś 30 osób, możemy skończyć offtopik? :-)
    Zgłaszajcie błędy, rozsądne requesty i tak dalej.

  93. zobaczysz peres, Opera Ci jeszcze kiedyś nogę podstawi ;)
    EOT

  94. @Riddle: Ale po co wytaczać armatę żeby pomóc mrówkom, jak można dać mrówce kijek i sama sobie poradzi?
    Oprócz tych co napisałem, trzykropek, paragraf, euro, trademark, &#8216; i &#8217; też by się przydały. (Te ostatnie to pojedyncze cudzysłowy definicyjne wg upiększacza.)
    A i <EXCERPT> też jakoś nie widzę.

    To nie jest offtopic, tylko request.

    Ale jak to często z 'developerami' bywa, oni lepiej wiedzą co end userowi jest do szczęścia potrzebne...
    A liczą się niestety wodotryski.

  95. W Wordpressie za typografię jest odpowiedzialna wtyczka, nikt nie bawi się w składanie znaków.

    EXCERPT sam w sobie nie jest za dobrym pomysłem, no ale działa, tak? Więc dodałem na prośbę Miśkfa.

    I wiem, najlepiej WYSWIG i będą wodotryski… ale to tylko złożony hack w JS a nie zupełnie nowa funkcjonalność. :)

  96. A znalazłem EXCERPT, to jeśli to tylko hack w JS, to co szkodzi dopisać do niego jeszcze kilka linijek? Zamiast się tu ze mną przekomarzać.
    Bo TinyMCE to jednak już przesada. A WYSIWYG to całkowita przesada.

  97. misiekf: „Riddle, mógłbyś dopisać do tych przycisków przycisk EXCERPT?”
    Riddle: „A to jest zarąbisty pomysł. :-)”
    Riddle: „EXCERPT sam w sobie nie jest za dobrym pomysłem, no ale działa, tak? Więc dodałem na prośbę Miśkfa.”

    Więc jak? ;-)

  98. Dzielenie wpisu za pomocą znacznika a nie 2 pól tekstowych jest złym pomysłem.

  99. Ja bym jakoś pogrupował i kolorystycznie odzielił tam różne rodzaje przycisków:
    Te wstawiające jakiś znacznik osobno, te wstawiające znak osobno i tab bym wyraźniej wyróżnił i oznaczył jako [tab] a nie jako strzałkę, bo nie odrazu wiadomo o co chodzi.
    Ale to tylko taka drobna sugestia ;-)

  100. Wielki dzięki, teraz to tylko pisać notki z panelu, niż z komunikatora ;D.

  101. Może jeszcze popraw taborder, bo denerwujące jest tabowanie z tematu do treści.

  102. @PawelS: Ja tam od dawna używam panelu... ach, te kategorie ;)

    A z przycisków nie będę korzystał, szybciej i łatwiej dla mnie jest wpisywać z głowy, poza tym IMHO przydałyby się ikonki bo idzie się w tych nazwach łatwo pogubić. Ale to tylko sugestia...
    Pytanie: czemu jest "<" i ">" ale następnie już "&amp;"? ;)

  103. Przecież &amp; nie jest do dodawania encji, bo Riddle ich nie uznaje - ma przedefiniowaną klawiaturę, tylko do "rozszyfrowywania" encji właśnie...
    Ikonki - nie, teraz z czerwonymi obwódkami i (chyba) mniejszymi czcionkami są w sam raz.

  104. Oczywiście, że „&amp;” pisane w ten sposób dekoduje znaki niezezwolone w HTML-u. Czytajcie opisy. Poza tym ma inny kolor, taki sam jak przyciski funkcyjne.

  105. Encji pewnie nie będzie, ale ściągawka się przyda. Znalazłem to: http://www.freezone.fc.pl/entities.html
    Jest gdzieś większa lista?

  106. ssss

Dodaj komentarz

Weryfikacja antyspamowa

Prosimy aby do formatowania wpisów używać składni Markdown:

  • **Strong** → Strong
  • _Em_ → Em
  • [Link](http://link.pl) → Link
  • > Cytat →

    Cytat