Archive of Our Own ^beta

ओळख

ही शिकवणी आपल्याला Archive of Our Own – AO3 (आपला स्वत:चा संग्रह) वर कार्य पृष्ठमांडणी कशी निर्माण करावी याचे क्रमा-क्रमाने मार्गदर्शन करेल. शिकवणीच्या शेवटी, आपण आपली स्वत:ची कार्य पृष्ठमांडणी निर्माण केलेली असेल, CSS चा वापर करून सानुकूल शैली परिभाषित केली असेल, आणि कार्य पृष्ठमांडणी आपल्या निवडलेल्या कार्यास लागू केली असेल.

ही शिकवणी खालील गोष्टी गृहीत धरून आहे:

• AO3 वर कार्य कसे पोस्ट करावे यांचे आपल्याला आधी पासून ज्ञान आहे. जर आपण AO3 वर आज पर्यंत एकही कार्य पोस्ट केले नसेल, तर हे बघा पोस्ट व बदल करणे वाविप्र किंवा यांचे क्रमा-क्रमाने अनुसरण करा शिकवणी: कार्य पोस्ट करणे.
• आपल्याला CSS चे मूलभूत ज्ञान आहे. जर आपल्याला CSS चा आढावा हवा असेल, तर W3Schools CSS शिकवणी एक मोफत मूलभूत कोर्स देऊ करते.
• आपण मूलभूत पृष्ठमांडणी वापरत आहात (संग्रह २.०). जर आपण सानुकूलित पृष्ठमांडणी वापरत असाल तर साईट रचने नुसार सूचनांमध्ये बदल होण्याची परवानगी असूद्या.

पृष्ठमांडणी काय आहे याची आपल्याला खात्री नसेल, किंवा आपल्याला आपल्या कार्यासाठी विद्यमान पृष्ठमांडणी वापरायची असेल, तर हे बघा पृष्ठमांडणी व संग्रह इंटरफेस वाविप्र.

Create New Skin (नवी पृष्ठमंडणी निर्मित करा) फॉर्म कडे दिशादर्शन

सुरुवात करण्यासाठी, पहिल्यांदी आपल्या Skins (पृष्ठमांडणी) पृष्ठावर जा:

1. लॉग इन करा व "Hi, (वापरकर्ता नाम)!" हे अभिवादन वापरून आणि मेनू मधून "My Dashboard" (माझा दर्शनीफळा) निवडून, किंवा आपले खाते-रेखाचित्र निवडून, आपल्या दर्शनीफळ्यावर जा.
2. पृष्ठाच्या बाजूस किंवा मोबाईल यंत्राच्या वरच्या बाजूस सापडणाऱ्या मेनू मधून "पृष्टमांडणी" निवडा.

हे आपल्याला आपल्या My Site Skins (माझ्या साईट पृष्ठमांडणी) पृष्ठाकडे नेईल, जिथे आपल्या सानुकूल साईट पृष्ठमांडण्यांची यादी असेल व आपल्या सानुकूल कार्य पृष्ठमांडण्या व सार्वजनिक पृष्ठमांडण्या निवडण्यासाठी बटण असेल. साईट पृष्ठमांडणी व कार्य पृष्ठमांडणी यामधील फरकाचे पुनरावलोकन करण्यासाठी, हे बघा पृष्ठमांडणी काय आहे?

या शिकवणी करीता, आपल्याला नवी कार्य पृष्ठमांडणी निर्मित करायची आहे, म्हणून नवी पृष्ठमंडणी निर्मित करा फॉर्म कडे दिशादर्शित होण्यासाठी "My Work Skins" (माझी कार्य पृष्ठमांडणी), व नंतर "Create Work Skin" (कार्य पृष्ठमांडणी निर्मित करा) निवडा.

नवी कार्य पृष्ठमांडणी उभी करा

सानुकूलित CSS वापरून नवी पृष्ठमांडणी निर्मित करण्यासाठी लागणारी क्षेत्र आहेत- Type (प्रकार), Title (शीर्षक), आणि CSS क्षेत्र. बाकी सर्व पर्यायी आहेत, पण आपण या शिकवणीमध्ये सर्व क्षेत्र बघणार आहोत.

प्रस्तुत झाल्यावर आपण परत जाऊन या कुठल्याही क्षेत्रांमध्ये बदल करू शकाल (सूचनांसाठी आपल्या कार्य पृष्ठमांडणीमध्ये बदल करा याचा संदर्भ घ्या).

प्रकार (आवश्यक)

जर आपण पृष्ठमांडण्या पृष्ठावरील "Create Work Skin" (कार्य पृष्ठमांडणी निर्मित करा) बटण निवडले असेल, ते आपोआप "Work Skin" (कार्य पृष्ठमांडणी) कडे जाईल.

शीर्षक (आवश्यक)

आपल्या पृष्ठमांडणीला वर्णणात्मक नाव द्या, म्हणजे तुम्ही भविष्यात निर्माण करणाऱ्या पृष्ठमांडण्यां पासून त्यामध्ये फरक करू शकाल. पृष्ठमांडणी शीर्षके विशिष्ट असायला हवी, म्हणून आपण त्यामध्ये आपले वापरकर्तानाम घालावे हि आम्ही शिफारस करतो (उदा. "घरात-अडकणे पृष्ठमांडणी (वापरकर्तानाम)").

वर्णन

आपली पृष्ठमांडणी काय करेल? विशिष्ट विषय असेल का? आपण नमुना पृष्ठमांडणी वर्णनांचा संदर्भ घेऊ शकता सार्वजनिक साईट पृष्ठमांडण्या किंवा सार्वजनिक कार्य पृष्ठमांडण्या पृष्ठ.

पूर्वावलोकन प्रस्तुत करा

पूर्वावलोकन म्हणून, इथे आपण आपल्या CSS शैलींचा कार्यरत असतानाचा स्क्रीनशॉट घाला. आपण पृष्ठमांडणीचा वापर करायला सुरुवात केल्यावर परत येऊन हे करू शकता.

सर्वजनिक करण्यासाठी अर्ज करा

हे वैशिष्ट्य वगळण्यात आलेले आहे. सद्यस्थितीत सानुकूलित पृष्ठमांडण्या सार्वजनिक करता येऊ शकत नाहीत, व हा चौकोन निवडल्याने आपल्या पृष्ठमंडणीच्या गोपनीयतेवर परिणाम होणार नाही.

CSS

नवी पृष्ठमंडणी निर्मित करा फॉर्म मध्ये शेवटच्या क्षेत्रामध्ये आपण सानुकूलित CSS घालावयाचा आहे. पुढील काही भागांमध्ये, आपल्या कार्याची नवी शैलीची रचना करण्या साठी, CSS कसा घालावा हे आम्ही स्पष्ट करू.

आपण वरील भागात "Use Wizard" (विझार्ड वापरा) नावाचे बटण नोंद केले असेल. ते Site Skin Wizard (साईट पृष्ठमांडणी विझार्ड) कडे नेते, जे दुर्दैवाने फक्त साईट पृष्ठमांडण्या निर्माणासाठी वापरले जाऊ शकते, कार्य पृष्ठमांडण्यांसाठी नाही (पृष्ठमंडणी विझार्ड काय आहे?)

पण चिंता नसावी—या शिकवणी नंतर आपण लवकरच विझार्ड व्हाल!

CSS चा वापर

सुरक्षेच्या कारणांस्तव, AO3 हे CSS गुणधर्म व त्यांच्या मूल्यांच्या साच्यांचे मर्यादित भार उचलत आहे. आपण केलेले बदल सेव केल्यावर कुठलाही समर्थित कोड काढून टाकला जाईल.

आपण CSS समर्थित गुणधर्मांची पूर्ण यादी याचे पुनरावलोकन करू शकता निळ्या प्रश्नचिन्हाची निवड करून ? जे CSS फिल्ड च्या वरच्या भागात असते. आपल्याला याचा सुद्धा संदर्भ घ्यावासा वाटेल सानुकूलित पृष्ठमांडणी मध्ये मी कुठले CSS गुणधर्म आणि मूल्ये वापरू शकतो? फॉन्ट्स, रंग, URLs, इत्यादी च्या अधिक माहितीसाठी.

आपला CSS संगणकात घालणे

या विभागात, आपण CSS घाला जो आपल्या कार्याला/कार्यांना कुठली शैली जोडली जाईल हे ठरवेल. आपण मुक्तपणे स्वतःचा CSS घालू शकता किंवा खालील उदाहरणाप्रमाणे करू शकता.

समाजा आपल्याला खालील HTML बरोबर काम आहे:

  
प्रिय बिली,
हे पत्र मी तुला लिहिले आहे. मला अशी आशा कि तू खूप प्रभावित होशील.
प्रामाणिकपणे,
ऍडिलेड 

कुठलीही कार्य पृष्ठमांडणी चा वापर न करता, हा मजकूर AO3 ची मूलभूत कार्यशैली प्रदर्शित करेल.

जर या मजकुराचा पेहराव आपल्याला खालील प्रतिमेप्रमाणे हस्तलिखित पत्रासमान दाखवायचा असेल, तर आपल्याला CSS चा वापर करून सानुकूलित शैली निर्मित करावी लागेल.

पहिल्यांदा, या मजकुराला काळी कड देऊया, फॉन्ट बदलूया, आणि फॉन्ट चा आकार वाढवूया. हे करण्यासाठी, आपल्या कार्य-पृष्ठमांडणी च्या CSS फिल्ड मध्ये पुढील घाला:

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

पुढे, let's add to the CSS फिल्ड ला असे काही घालूया ज्याने ("ऍडिलेड") या सही ला विशेष शैली प्राप्त होईल. खालील CSS घाला ज्याने सहीच्या फॉन्ट चा आकार अजून वाढेल व लाल रंग दिला जाईल:

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

शेवटी, भर दिला गेलेला मजकूर ("खूप") अधोरेखित करण्यासाठी, शेवटचा CSS घाला:

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

आपल्या CSS फिल्ड्मध्ये आता तीन नवीन शैलींचे CSS असतील:

  
#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;
}

पुढीलW3Schools CSS संदर्भ अतिरिक्त CSS गुणधर्मांची यादी पुरवतो जी आपण आपल्या कार्यामध्ये घालू शकता.

शैलीच्या उदाहरणासाठी, आम्ही पुढील दुवा बघण्याचीसुद्धा शिफारस करीत आहोत सार्वजनिककार्य-पृष्ठमांडण्या.

नोंद: आपले CSS सिलेक्टर्स बंद करणे (उदा. .letter, .signature, आणि emघटक) आयडीच्या खाली #workskin असणे आवश्यक आहे म्हणजे आपल्या शैली फक्त निवडलेल्या कार्य मजकुरास जोडल्या जातील: म्हणजे आपल्या कार्यपृष्ठाच्या ब्लर्ब् च्या खालील सर्व काही आणि "Top" (वरचे) बटण च्या वरचा मजकूर. पण, आपण #workskin आयडी च्या खालील CSS बंद करायला विसरला असाल, तर आपण आपला कोड प्रस्तुत केल्यावर आम्ही तो आपोआप तिथे घालू.

आपली नवीन कार्य पृष्ठमांडणी सेव्ह करणे

एकदा का आपण आपल्या CSS चे पुनरावलोकन केले व आपण आपल्या कोड विषयी खूष असाल, आपली नवीन कार्य पृष्ठमांडणी सेव्ह करण्यासाठी "Submit" (प्रस्तुत करा) बटण निवडा. Your styling will not be applied to any works until you've manually added the skin to each work (we'll go over this in Applying Your Work Skin).

Once you select "Submit", we will remove any unsupported code and make sure all selectors are nested under a #workskin id.

आपल्या कार्य-पृष्ठमांडणी मध्ये बदल करणे

आपली पृष्ठमांडणी प्रस्तुत केल्यावर लगेचच आपण आपल्या कोडचे पुनरावलोकन करून व "Edit" (बदल करा) बटण निवडून कोणतेही बदल करू शकता.

आपली कार्य-पृष्ठमांडणी लागू करणे

आपण कार्य पृष्ठमांडणी निर्मित केली आहे—आता आपण ती पृष्ठमांडणी AO3 वरील आपल्या कोणत्याही कार्यास लागू करू शकता. लक्षात ठेवण्यासाठी काही नोंदी:

• एक कार्य एकच् पृष्ठमांडणी वापरू शकते.
• एक पृष्ठमांडणी अनेक कार्यांस लागू होऊ शकते.
• जर आपण पृष्ठमांडणी खोडलीत, तर कुठलेही कार्य ज्यास ती पृष्ठमांडणी वापरली असेल ते शैली हरवेल.
• जर आपण कोणते कार्य सह-निर्मित केले असेल, आपले सह-निर्माता(ते) सुद्धा आपण शेर केलेल्या कार्याला पृष्ठमांडणी लागू करू शकेल.

जेव्हा आपल्याला माहित असेल कि आपण कोणत्या कार्यास नवीन फ़ॉरमॅटिंग लागू करू इच्छिता, तेव्हा आपल्या कार्याच्या Edit Work (कार्यात बदल करा) पृष्ठावर जा. आपल्याला सूचनांची गरज असल्यास मी कार्यात बदल कसा करू शकतो? याचा संदर्भ घ्या.

कार्यात बदल करा पृष्ठाच्या Associations (सहयोगात्मक) विभागात, "Select Work Skin" (कार्य पृष्ठमांडणी निवडा) यादीतून आपल्या कार्य पृष्ठमांडणीचे शीर्षक निवडा.

आपल्या कार्य पृष्ठमांडणीतील CSS सिलेक्टर्स जर आपल्या कार्याच्या HTML घटकांशी आधीच अनुरूप असतील (जसेकी सर्व

किंवा

टाचणखुणा), तर मुक्तपणे पुढील विभागात जा व थेट आपल्या कार्याचे जतन व पूर्वावलोकन करा इकडे जा. उदाहरणार्थ, जर आपल्या कार्यातील इटालिक मजकुर आपल्याला दुहेरी अधोरेखित करावयाचा असेल, तर पुढील CSS असलेली कार्य पृष्ठमांडणी लागू केल्याने आपोआप

टाचणखुणानी:

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

खुणीत मजकुरास दुहेरी अधोरेखन केले जाईल.

आपल्या कार्याच्या HTML मध्ये CSS सिलेक्टर्स चा वापर

आपले CSS सिलेक्टर्स जर आपल्या कार्याच्या HTML बरोबर अनुरूप नसतील, तर लगेचच आपल्या

प्रिय बिली,
;हे पत्र मी तुला लिहिले आहे. मला अशी आशा कि तू very प्रभावित होशील.
प्रामाणिकपणे,
ऍडिलेड

आपले कार्याचे जतन व पूर्वलोकन करणे

आपण "Preview" (पूर्वावलोकन) हे बटण निवडून, किंवा थेट "Post Without Preview" (पूर्वावलोकनाशिवाय पोस्ट करा) हे निवडून आपले बदल जतन करून आपल्या नवीन शैलीतील कार्याचे पूर्वावलोकन करू शकता.

अभिनंदन, आपले कार्य आता मोहक झाले आहे!

जर आपण आपला CSS संगणकात घालणे and आपल्या कार्याच्या HTML मध्ये CSS सिलेक्टर्स चा वापर या उदाहरणाप्रमाणे केले असेल, तर आपल्या कार्याचा मजकूर आता हस्तलिखित पत्राजोगा दिसत असेल.

जर आपल्याला एकाच वेळी अनेक कार्यांना आपली कार्य पृष्ठमांडणी लागू करावयाची असेल तर, मी एकाच वेली अनेक कार्यांमध्ये बदल कसा करू? याचा संदर्भ घ्या. आपल्याला आपल्या पृष्ठमांडणीचे CSS सेलेक्टर्स घाला हे, आपण तसे आधीच केले नसल्यास, प्रत्येक कार्याच्या HTML मध्ये वैयक्तिकरित्या घालावे लागेल याची नोंद असू द्या.

कार्य पोस्ट करणे व बदल करणे यावरील अधिक माहितीसाठी, कृपया पोस्ट व बदल करणे वाविप्र याचा संदर्भ घ्या. क्रमाक्रमाच्या मार्गदर्शनासाठी आपल्याला हे ही बघावेसे वाटेल शिकवणी: कार्य पोस्ट करणे.

मला माझ्या प्रश्नाचे उत्तर अजूनही मिळालेलं नाही, तर ते कुठे मिळु शकते?

Archive of Our Own – AO3 (आमचा स्वतःचा संग्रह) वरील पृष्ठमांडणी विषयी अधिक माहितीसाठी, पृष्ठमांडणी व AO३ इंटरफेस वाविप्र याचा संदर्भ घ्या. AO३ विषयी वारंवार विचारल्या जाणार्या काही इतर प्रश्नांची उत्तरे AO3 वाविप्र इथे मिळतील. नियम आणि ध्येयधोरण-विषयक प्रश्नोत्तरे नियम आणि ध्येयधोरणे वाविप्र इथे सापडतील. आमच्या ज्ञात अडचणी विभागातही ज्ञात अडचणी एकदा जरूर डोकावून पहा. अजून काही मदत हवी असेल तर समिती-संवाद समितीयांच्याशी संपर्क साधा.