Archive of Our Own ^beta

Bevezetés

Ez az útmutató lépésről lépésre végigvezet azon, hogyan tudsz munkafelületet készíteni az Archive of Our Own – AO3 (A Mi archívumunk)-on. Az útmutató végére elkészítheted a saját munkafelületed, használhatsz CSS-t a személyes stílus meghatározására és alkalmazhatod a munkafelületed a kiválasztott munkádra.

Ez az útmutató feltételezi a következőket:

• Előzetes tudással rendelkezel munkák közzétételéről az AO3-on. Ha még nem tettél közzé munkát az AO3-on, fontold meg, hogy felkeresed a Közzététel és szerkesztés GyIK-et, vagy haladj végig rajta lépésről-lépésre itt: Útmutató: Munka posztolása.
• Alapismerettel rendelkezel a CSS-ről. Ha szükséged van egy áttekintésre a CSS-ről, a W3Schools CSS Tutorial egy ingyenes, alapszintű útmutatót nyújt.
• Az alapértelmezett felületen keresztül használod az oldalt (Archive 2.0). Ha egyéni felületet használsz, lehetséges, hogy változtatásokat kell majd megengedned, ahol az oldalelrendezésed eltér az utasításokról.

Ha nem vagy benne biztos, mit jelent a "munkafelület", vagy egy már létező felületet szeretnél inkább használni a munkádon, a Felületek és az Archívum Felszínek GyIK oldalon több információt találsz róluk.

Eljutni a Create New Skin (Új Felület Készítése) lapra

A kezdéshez először menj a Skins (Felületek) oldaladra:

1. Lépj be és menj a Faladra: a “Hi, (Felhasználónév)!” alatt válaszd ki a “My Dashboard”-ot (Az Én Falam) a menüből, vagy lépj a profilképedre.
2. Válaszd a “Skins”-t az oldal szélén - vagy tetején, mobil eszköz esetén - található menüből.

Ez a My Site Skins (Az Én Oldalfelületeim) oldalra visz téged, ami felsorolja az egyéni oldalfelületeidet és gombokat biztosít, hogy elérhesd az egyéni munkafelületeidet és a nyilvános felületeket. Hogy összehasonlíthasd az oldalfelületeket és a munkafelületeket, látogass el a Mi is egy felület? oldalra.

Ebben az útmutatóban egy új munkafelületet szeretnénk készíteni, tehát válaszd ki a “My Work Skins” (Az Én Munkafelületeim)-et, majd a “Create Work Skin”-t (Munkafelület Készítése), hogy válts át az Új Felület Készítése lapra.

Új munkafelület előkészítése

Egyéni CSS-t használva új felület létrehozásához a szükséges mezők a Type (Típus), Title (Cím) és a CSS mezők. A többi tetszőlegesen választható, de mi az összes mezőn végigmegyünk az útmutató során.

Vissza tudsz majd menni, hogy szerkeszd ezen mezők bármelyikét azután is, hogy elfogadtad a változtatásokat (ehhez utasításokat a Munkafelületed Szerkesztése oldalon találsz).

Típus (kötelező)

Ha kiválasztottad a "Create Work Skin" (Munkafelület létrehozása) gombot a Felületek oldalon, ez automatikusan "Work Skin" (Munkafelület)-re változik.

Cím (kötelező)

Adj a felületednek egy leíró jellegű címet, hogy meg tudd különböztetni bármely másik munkafelülettől, amit a jövőben létrehozol. Minden felület címének egyéninek kell lennie, ezért ajánljuk, hogy add hozzá a címhez a felhasználónevedet (pl. "Homestuck Felület (felhasználónév)").

Leírás

Mit csinál majd a felületed? Lesz egy adott téma? Felhasználhatsz néhány példa felület-leírást a Nyilvános Oldalfelületek vagy a a href="/skins?skin_type=WorkSkin">Nyilvános Munkafelületek oldalakról.

Előnézet feltöltése

Itt fel tudsz tölteni egy képernyőfotót a CSS stílusaidról munka közben előnézetként. Vissza tudsz jönni és meg tudod csinálni ezt azután, hogy elkezdted használni a munkafelületedet.

Nyilvánossá tétel

Ez a lehetőség már nem él. Egyéni felületeket már nem lehet nyilvánossá tenni, így a négyzet kipipálása nem változtat a felületed megosztásán.

CSS

Az utolsó mező az Új Felület Készítése lapon az egyéni CSS-ed betáplálására van. A következő néhány részben elmagyarázzuk, hogyan tudod bevinni a CSS-t, ami megformázza majd a munkád új stílusát.

Láthatsz egy gombot az oldal tetején, "Use Wizard" (Varázsló Használata) felirattal. Ez elvisz a Site Skin Wizard (Oldalfelület Varázsló)-hoz, ami sajnos csak oldalfelületek készítésére használható, munkafelületekére nem. (Mi a Felület Varázsló?)

De ne aggódj—ezzel az útmutatóval te is varázsló leszel hamarosan!

CSS használata

Biztonsági okokból az AO3 csak limitált mennyiségű CSS tulajdonságot és hozzá köthető értéket támogat. Bármely nem támogatott kód el lesz távolítva miután elmented a változtatásokat.

Átnézheted a támogatott CSS tulajdonságok teljes listáját, ha rámész a kék kérdőjelre ? a CSS mező tetején. További információért a betűtípusokról, színekről, URL-ekről stb, látogasd meg a Milyen CSS tulajdonságokat és értékeket használhatok egyéni felületekben? oldalt.

CSS bevitele

Ebben a részben beviszed a CSS-t, ami meghatározza majd, milyen stílust alkalmazhatsz a munká(i)don. Nyugodtan add hozzá a saját CSS-ed, vagy kövesd az alábbi példát.

Mondjuk, hogy van egy munkád az alábbi HTML-el:

  
Kedves Billy,
Itt a levél, amit neked írtam. Remélem, hogy nagyon lenyűgöz.
Tisztelettel,
Adelaide

Bármilyen munkafelület hozzáadása nélkül ez a szöveg az alapértelmezett AO3 munkastílusban jelenne meg.

Ha azt szeretnéd, hogy ennek a szövegnek a megjelenése egy kézzel írott levélé legyen, mint az alábbi képen, egyéni stílusokat kell készítened CSS segítségével.

Először is, adj a szövegnek egy vékony fekete keretet, változtasd meg a betűtípust és növeld meg a betűméretet. Ehhez add hozzá az alábbiakat a munkafelületed CSS mezőjéhez:

  
#workskin .letter {
border: 1px solid;
padding: 15px;
font-size: 1.1em;
font-family: "Comic Sans MS", cursive, sans-serif;
}

Következőként adj hozzá a CSS mezőhöz, az aláírás ("Adelaide") speciális stílusáért. A betűméret tovább növeléséért és az aláírás piros színéért vidd be az alábbi CSS-t:

  
#workskin .signature {
font-size: 1.2em;
color: red;
}

Végül, a kiemelt szöveg ("nagyon") aláhúzásáért add hozzá az utolsó CSS-t:

  
#workskin em {
border-bottom: 3px double;
}

A CSS meződben most három különböző CSS stílusnak kell lennie:

  
#workskin .letter {
border: 1px solid;
padding: 15px;
font-size: 1.1em;
font-family: "Comic Sans MS", cursive, sans-serif;
}
#workskin .signature {
font-size: 1.2em;
color: red;
}
#workskin em {
border-bottom: 3px double;
}

A W3Schools CSS Reference biztosít egy hasznos listát további CSS tulajdonságokról, amit hozzáadhatsz a munkádhoz.

A Nyilvános Munkafelületeknél is remek stílusötleteket találni.

Jegyzet: A CSS kijelölőd (pl. a .letter, .signature, és em elemek) #workskin azonosító alá való beillesztésére azért van szükség, hogy a stílusaid csak a választott munkád tartalmán jelenjenek meg: minden a fülszöveg alatt és a "Top" (Oldal teteje) gomb fölött a munkád oldalán. De ha elfelejted a #workskin azonosító alá beilleszteni a CSS-ed, automatikusan hozzáadjuk ezt neked miután elmented a kódod.

Az új munkafelületed mentése

Ha átnézted a CSS-ed és elégedett vagy a kódoddal, válaszd ki a "Submit" (Bevitel) gombot, hogy elmentsd az új munkafelületed. A stílusod nem jelenik majd meg egyetlen munkán sem, amíg manuálisan hozzá nem adtad a felületet minden munkához (ezen is átmegyünk majd a Munkafelületed Alkalmazása részben).

Ha kiválasztottad, hogy "Submit", eltávolítunk minden nem támogatott kódot és meggyőződünk arról, hogy minden kijelölő egy #workskin azonosító alatt található.

A munkafelületed szerkesztése

Rögtön miután leadod az új munkafelületed, át tudod nézni a kódodat és az "Edit" (Szerkesztés) gomb kiválasztásával változtathatsz rajta.

Munkafelületed alkalmazása

Elkészítetted a munkafelületet—most alkalmazhatod ezt a felületet bármelyik munkádon az AO3-on. Néhány dolog, amire érdemes emlékezni:

• Egy munkán csak egy felületet használhatsz.
• Egy felület több munkára is alkalmazható.
• Ha törölsz egy felületet, bármely munka, amin azt használtad, elveszíti a beállított stílust.
• Ha társalkotója vagy egy munkának, a társalkotó(i)d is használhatják a munkafelületed a közös munkátokra.

Ha tudod, melyik munkára szeretnéd használni az új formázásodat, menj a munkád Edit Work (Munka Szerkesztése) oldalára. További információt erről a Hogyan szerkeszthetek egy munkát? alatt találsz.

Az Associations (Kapcsolatok) részben az Edit Work oldalon válaszd ki a munkafelületed címét a "Select Work Skin" (Munkafelület Kiválasztása) listából.

Ha a CSS kijelölők a munkafelületedben megegyeznek már a munkád HTML-jében meglévő elemekkel (úgy, mint az összes

vagy

kulcsszavak), nyugodtan ugord át a következőket és menj egyenesen az A Munkád Mentése és Előnézete részhez. Például, ha szeretnél minden dőlt szövegnek a munkádban dupla aláhúzást adni, használj egy munkafelületet az alábbi CSS-el, ezzel automatikusan duplán aláhúzva minden szöveget, ami

kulcsszóval van jelölve:

  
#workskin em {
border-bottom: 3px double;
}

A CSS kijelölők használata a munkád HTML-jében

Ha a CSS kijelölőid nem egyeznek meg a munkád HTML-jével, most hozzá tudod adni a

Kedves Billy,
Itt a levél, amit neked írtam. Remélem, hogy nagyon lenyűgöz.
Tisztelettel,
Adelaide

Munkád mentése és előnézete

Meg tudod nézni, hogyan fog kinézni az új stílussal a munkád a "Preview" (Előnézet) gombbal, vagy elmentheted a változtatásokat rögtön a "Post Without Preview" (Mentés Előnézet Nélkül)-el.

Gratulálunk, a munkád mostantól díszes!

Ha követted a példát a CSS Bevitele és az A CSS Kijelölők Használata a Munkád HTML-jében részekből, a munkád szövege most egy kézzel írott levélére hasonlít.

Ha szeretnéd alkalmazni a munkafelületed több munkára egyszerre, több információt találsz itt: Hogyan szerkeszthetek egyszerre több munkát? Ne felejtsd el, hogy így is külön-külön be kell illesztened a felületed CSS kijelölőit minden munka HTML-jébe, ha még nem tetted meg.

További információért munkák közzétételéről és szerkesztéséről látogasd meg a Közzététel és Szerkesztés GyIK-et. Lépésről-lépésre útmutatót pedig itt találsz: Útmutató: Munka Közzététele.

Hol találok bővebb információt, ha a kérdésem itt nincs megválaszolva?

Több információért a felületekről, beleértve az oldalfelületeket és a nyilvános felületeket, látogasd meg a Felületek és Archívum Felszíne GyIK-et. Jó pár, az Archive of Our Own – AO3-mal (A Mi Archívumunk) kapcsolatos gyakran ismételt kérdést megválaszolunk a nagyobb területeket lefedő AO3 GyIK-ben. A Szolgáltatási Feltételekkel kapcsolatos kérdések és válaszok a Szolgáltatási Feltételek GyIK-ben találhatóak. Ezen felül érdemes lehet egy pillantást vetnetek az Ismert Problémák listájára is. Ha további kérdésetek lenne, kérünk, hogy lépjetek kapcsolatba a Támogatással.