Skocz do zawartości

Witamy na polskim forum Contao
Zarejestruj się teraz, aby skorzystać ze wszystkich funkcji forum. Kiedy się zalogujesz, będziesz mógł tworzyć tematy, pisać posty, rozdawać punkty reputacji, korzystać z prywatnych wiadomości i zarządzać swoim profilem. Jeśli posiadasz już konto, zaloguj się - w przeciwnym wypadku zarejestruj się już teraz!
Zdjęcie

Szablon - jak zrobić własny szablon w TYPOlight?


  • Zaloguj się, aby dodać odpowiedź
39 odpowiedzi w tym temacie

#1
Artur

Artur

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 13 postów
Witam.
Na stronie:
http://www.typolight... ... _templates
jest tutek na temat własnych szablonów, jednak po wykonaniu wszystkich czynności szablonu nie ma... Nie wiem czy Polski support ktoś jeszcze prowadzi, mam nadzieję że tak i z chęcią bym się przyłączył ponieważ uważam typolight za jeden z ciekawszych systemów ale sam jeszcze nie mam dostatecznej wiedzy :( Jeżeli autor strony mógłby wkleić krok po kroku jak zrobił szablon do tej strony, krok po kroku i najlepiej ze screenami byłbym niezmiernie wdzięczny!
Pozdrawiam,
Artur.
EDIT:
Oczywiście chodziło o tutka po Polsku!
  • 0

#2
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
W najbliższy weekend postaram się nakręcić screencasta, ze screenami to by była kupa roboty :)
  • 0

Codefog - Contao web development


#3
Artur

Artur

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 13 postów
Extra, jak możesz to napisz też parę słów wyjaśnienia na forumie do filmiku. Będę czekać z niecierpliwością :)
Pozdrawiam,
Artur
  • 0

#4
qrczak

qrczak

    Ekspert

  • Zarejestrowani
  • PipPipPipPipPip
  • 415 postów
  • LokalizacjaŻuławy

[...] jednak po wykonaniu wszystkich czynności szablonu nie ma...

Co to znaczy, że szablonu nie ma? Może napisz coś więcej co po kolei robiłeś wtedy chętnie pomogę, na chwile obecną mam za mało informacji.
Pozdrawiam
Marcin
  • 0

#5
Artur

Artur

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 13 postów
http://www.typolight... ... _templates
Pod tym linkem jest tutek. Wykonałem wszystkie czynności jakie kazali. Następnie w panelu admina stworzyłem nowy css oraz przypisałem wszystkie rzeczy do fe_bluefreedom2.tpl następnie uruchomiłem stronę i miałem czarne literki i białe tło (no linki na niebiesko ale tego nie liczę :P ) Czyli że szablonu NIE MA. Wynik jest prosty, dodanie nowego szablonu jest bardziej skomplikowane niż by się wydawało i coś źle zrobiłem. Dla tego przoszę o tutka po polsku, bardzo liczę na filmik Tru i mam nadzieję że sie naumiem, b o tak naprawdę tylko to mnie trzyma przed stałym przeniesieniem się na ten system.
Pozdrawiam,
Artur
EDIT;
Może przedstawię to co chciałbym uzyskać od TYPOlight.
Tak więc postawiłem na Typo stronę mojej grupy rekonstrukcyjnej (http://www.oswd.org/design/preview/id/3515
Oprucz tego, w niedalekiej przyszłości chcę postawić na Typo swoją stronę domową (taką o mnie :P ) i żeby miała dokładnie taki układ jak ta http://www.oswd.org/...preview/id/3508
Z tutka zrozumiałem że mogę zaadoptować dowolną stronę HTML na potrzeby TYPOlight co by mi bardzo ułatwiło życie, z góry dziękuję za pomoc i myślę że wiele osób skorzystało by z takiego tutka po Polsku!
Jeszcze raz pozdrawiam,
Artur :)
  • 0

#6
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski

Następnie w panelu admina stworzyłem nowy css oraz przypisałem wszystkie rzeczy do fe_bluefreedom2.tpl następnie uruchomiłem stronę i miałem czarne literki i białe tło (no linki na niebiesko ale tego nie liczę :P) Czyli że szablonu NIE MA.

Jak zaczynałem swoją przygodę z TL miałem dokładnie identyczny problem. U mnie przyczyną była źle poadana ścieżka do pliku css i/ewentualnie obrazków.
Flimik jest już zrobiony, jednakże nie ma tam opisu czynności jakie trzeba wykonać - program mi się zawiesza zawsze kiedy próbuje zedytować klip :(
Z początku miała być narracja, ale z racji że mój ponadczasowy mikrofon przestał działać, narazie musisz poczekać na finalną wersję.
Link do filmiku:
http://87.98.141.75/... szablonow.html
(został zrealizowany na bazie tutorialu z wiki, szablon BlueFreedom2)
Z poradnika Leo praktycznie nie wynosimy nic, poza podstawami. Warto jednak obejrzeć jego narratowany screencast.
A i jeszcze jedno, jak będziesz chciał video tego typu oparte na szablonie który wybierzesz, pisz śmiało! :)
  • 0

Codefog - Contao web development


#7
qrczak

qrczak

    Ekspert

  • Zarejestrowani
  • PipPipPipPipPip
  • 415 postów
  • LokalizacjaŻuławy

http://www.oswd.org/design/preview/id/3515
http://www.oswd.org/...preview/id/3508

Oba te szablony bez problemu da się zaadaptować na potrzeby Typolight.
Zobacz filmik, który zrobił Tru. Pamietaj o ścieżkach i o odpowiednich nazwach plików.

http://www.kamil.vdl... szablonow.html
(został zrealizowany na bazie tutorialu z wiki, szablon BlueFreedom2)

Super! Naprawdę fajny.
I taka luźna sugestia - używaj w edytorze kodowania utf-8 lub "ANSI as utf-8"
Pozdrawiam
Marcin
  • 0

#8
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
Tworząc drugi profil na systemie żeby nagrać screencasta, PSPad nie użył kodowania jaki mam na domyślnym profilu :P Stąd cała afera.
Artur, moment w którym klikam na "Ustal szablon" możesz pominąć, ale tylko wtedy gdy do strony nie miałeś wcześniej przypisanego szablonu.
  • 0

Codefog - Contao web development


#9
Artur

Artur

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 13 postów
Witam,
filmik jest wprost genialny, 100-krotne dzięki za niego! opublikujcie go jako oficjalnego tutka! Ja zrobiłem już 2 szablony dzięki niemu (razem z przezentowanym na screencascie :P ) Ten drugi zrobiłem jako test poziomego menu ale wyszło coś takiego :( : http://www.oswd.org/design/preview/id/3508
Jak zrobiliście menu na waszej stronie??
  • 0

#10
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
Spróbuj usunąć znacznik

oraz

w pliku
/system/modules/frontend/templates/mod_navigation_items.tpl
a w pliku css dodać:
.mod_navigation li {
display: inline;
}

  • 0

Codefog - Contao web development


#11
Artur

Artur

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 13 postów
http://www.luszczek.net/ Dzięki serdeczne, działa tak jak chciałem :) Jest mały zonk tylko z tym że się przesuwa i że to widać ale spróbuję sam już to obejść :P Jak zrobie coś konkretnego to się odezwę.
Pozdrawiam,
Artur
  • 0

#12
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
Mi też się jakoś tak śmiesznie przesuwa.
Jutro coś pokombinuję, jak coś to dam ci znać. Teraz idę oglądać II połowę meczu Polska-Belgia :D
  • 0

Codefog - Contao web development


#13
Artur

Artur

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 13 postów
Zauważyłem coś dziwnego, na localhoście postawiłem sobie jeszcze kilka różnych tempaltek i we wszystkich jest ten sam zonk....
Ĺťeby się nie rozdrabniać pokażę o co chodzi na przykładzie templatki na http://www.luszczek.net/ Po kompilacji wygląda następująco:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pl">
<!--
	This website was built with TYPOlight :: open source web content management system
	TYPOlight was developed by Leo Feyer (leo@typolight.org) :: released under GNU/GPL
	Visit project page http://www.typolight.org for more information
//-->
<head>
<base href="http://www.luszczek.net//" />
<title>STRONA - Start</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<script type="text/javascript" src="plugins/tablesort/js/tablesort.js"></script>
<script type="text/javascript" src="plugins/mootools/mootools.js"></script>
<script type="text/javascript" src="plugins/slimbox/js/slimbox.js"></script>
<script type="text/javascript" src="plugins/ufo/ufo.js"></script>
<link rel="stylesheet" href="plugins/slimbox/css/slimbox.css" type="text/css" media="screen" />
<link rel="stylesheet" href="plugins/tablesort/css/tablesort.css" type="text/css" media="screen" />
<link rel="stylesheet" href="plugins/dpsyntax/dpsyntax.css" type="text/css" media="screen" />
<link rel="stylesheet" type="text/css" href="tl_files/BWS/style.css" media="screen" />
</head>
<body>
<div id="wrap">
<div id="header"><h1>Test tempaltki</h1>
  <h2>STRONA - Start</h2>
  </div>
<div id="menu">
<!-- indexer::stop -->
<div class="mod_navigation block" style="text-align:center;">
<a href="index.php/start.html#skipNavigation_23" class="invisible" title="Pomiń nawigacje"></a>
<ul class="level_1">
Start<a href="index.php/link.html" title="Link" class="last" onclick="this.blur();">Link</a></ul>
 
<a id="skipNavigation_23" class="invisible" title="Pomiń nawigacje"></a>
</div>
<!-- indexer::continue -->
</div>
<div id="content">
<div class="mod_article block" id="start">
<div class="ce_text block">
<h2>Test szablonu</h2>
Jakiś tekst na nemat niczego
</div>
 
</div>
</div>
<div id="footer">
<!-- indexer::stop -->
<div class="mod_breadcrumb block">
<span class="active">Start</span>
</div>
<!-- indexer::continue -->

<b>8</b> unikalnych odwiedzin! 
</div> 
</div>
</body>
</html>
Chodzi o linję w której jest:
<a href="index.php/start.html#skipNavigation_23" class="invisible" title="Pomiń nawigacje"></a>
Co to jest i jak to wywalić?? Możliwe że to jest właśnie przyczyna przesunięcia...
  • 0

#14
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
W pliku /system/modules/frontend/templates/mod_navigation.tpl jest linijka:
<a id="<?php echo $this->skipId; ?>" class="invisible" title="<?php echo $this->skipNavigation; ?>"></a>
oraz
<a href="<?php echo $this->request; ?>#<?php echo $this->skipId; ?>" class="invisible" title="<?php echo $this->skipNavigation; ?>"></a>

  • 0

Codefog - Contao web development


#15
Artur

Artur

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 13 postów
Po skasowaniu tych linijek menu całkowicie znika :( Na mojej stronie testuje teraz alternatywmne metody nawigacji w javascript, mam na razie problem z FF1+ jak tego nie obejdę będzie trzba samemu napisac a tego akurat nie lubie :P Na szczęście Typo genialnie wyłapuje "obce" skrypty co znowu czyni go number one na rynku. Mimo pewnych "niedoróbek" jest to chynba najlepszy skrypt jaki widziałem i im dłużej przy nim siedzę tym bardziej się do niego przekonuję :) W tej chwili najbardziej mi brakuje opcji samodzielnego układania menu w panelu, niby taki pikuś a już kilka dni nad tym siedzę... Jak coś mądrego wykombinuję dam znać :)
Pozdrawiam,
Artur
  • 0

#16
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
Czasem tak jest, że z niektórami szablonami jest konflikt, ale naprawdę są to pojedyncze wyjątki. Jakiś czas temu udało mi się przerobić nawet taki oto szablon http://www.oswd.org/...preview/id/3628 , a jednak tego czarno-białego nijak nie mogę rozgryźć.
Bardzo użyteczną cechą TYPOlight'a jest współpraca z MooTools, co pozwala uzyskać naprawdę piękne efekty na stronie.
  • 0

Codefog - Contao web development


#17
Artur

Artur

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 13 postów
Poprubuję z innymi szablonami jeszcze, na stronie nic nie mam więc mogę sobie pozwolić na troszeczkę zabawy :) Jak uda mi się zrobić coś co "będzie działać" dam znać :P
Edit;
Zapytam odrazu żeby nie spamować forum; do czego i jak mogę wykorzystać MooTools??
  • 0

#18
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
Jedna z bibliotek jest wbudowana w TYPOlight, tzw. akordeon. Służy on do rozwijania i zwijania poszczególnych elementów listy:
Dołączona grafika
Efekty możesz podziwiać tutaj: Demo TYPOlight lub w dziale FAQ na naszej stronie.
Dema MooTools możesz znaleźć pod adresem: http://demos.mootools.net/
Jak używać nie jestem narazie w stanie ci powiedzieć, bo jeszcze się tym nie bawiłem.
  • 0

Codefog - Contao web development


#19
Artur

Artur

    Nowy na forum

  • Zarejestrowani
  • Pip
  • 13 postów
aha, to już wiem o co chodzi, uzywałem i nawet nie wiedziałem czego :P
Zrobiłem templatkę w koÅ„cu :) Niestety nadal jest ten zonk z poruszającymi się linkami:( ale co tam :P Templatkę można pobrać i potestować z http://luszczek.net
....
zapomniałem się podpisać w readme :( ale co tam :)
  • 0

#20
Kamil

Kamil

    Contao ambassador

  • Administratorzy
  • 1 538 postów
  • Strona www:zobacz
  • LokalizacjaLidzbark Warminski
Prosta ale zgrabna :)
Tak odnośnie mojego screencasta, w miejscu gdzie wpisywałem
<?php echo $this->title; ?>
możesz wpisać
<?php echo $this->header; ?>
I wtedy nie będzie czegoś takiego, że wyświetla się: Tytuł strony - sekcja
Co do menu, to spróbuj jeszcze raz edytować plik mod_navigation_items.tpl (linijka 5):
<li class="active<?php if ($item['class']): ?> <?php echo $item['class']; endif; ?>"><a class="active"><?php echo $item['link']; ?></a><?php echo $item['subitems']; ?></li>
Wydaje mi się, że równie dobrze by było z

(...)

.
  • 0

Codefog - Contao web development





Użytkownicy przeglądający ten temat: 0

0 użytkowników, 0 gości, 0 anonimowych użytkowników