كيفية البدء في تعلم CSS وتطوير السمات؟
ما هي اقتراحاتك لتعلم تطوير CSS و WordPress؟
لقد كنت أستخدم WordPress منذ أكثر من 4 سنوات حتى الآن ، لكنني لم أشعر مطلقًا بالراحة مع CSS أو تصميم السمة (يمكنني تعديله هنا وهناك ، لكن هذا لا يفعل الكثير حقًا). أحب أن أكون قادرًا على القيام بذلك ، لكن لا أعرف من أين أبدأ. معظم الأدلة التي صادفتها ليست WPمحددة ، وأخشى أن أذهب إلى مادة زائدة عن الحاجة.
شكر
بادئ ذي بدء تختلف بين الاشياء. WP ليست CSS و CSS ليست WP. لكن WP الموضوعات تستخدم CSS. لذا ، إذا علمت بوجود CSS ، فأنت لا تقوم في الأساس بالخطأ (الشيء الجيد في CSS هو ، فمن الشائع بين جميع المواقع ). الجزء الآخر هو HTML. ثم لديك PHP.
لذلك هذه هي ثلاث لغات الكمبيوتر التي يتم استخدامها مع بعضها البعض:
- لغة البرمجة: PHP
- لغة هيكلية: HTML
- لغة المجال المحددة: CSS
ثم لديك بنية شبكة متعددة الطبقات: PHP يتم تنفيذها على الخادم ويتم توفير HTML و CSS بواسطة الخادم ولكن تتم قراءته/معالجته بواسطة المستعرض على جهاز الكمبيوتر العميل.
لذا ، حتى لو كانت السمات قد تبدو بسيطة ، مع WP كل هذا يختلط ويمكن تبديل نفسك بين الأشياء مرة أخرى.
PHP موجود في ملفات "Theme" (PHP) ، يتم إنشاء HTML (وكذلك هو) داخل ملفات Theme ، CSS في ملف CSS.
لذلك عليك أن تقرر بنفسك ما تريد أن تتعلمه. تختلف معظم الموارد بين PHP و HTML/CSS.
بناءً على سؤالك ، لا يمكنني أن أقترح عليك سوى تعلم CSS. إنها قوية جدًا بعد فهمك الكامل لـ Cascade. تحتاج إلى معرفة HTML الأمامية (وليس PHP ، فقط HTML). في النهاية ، تعد CSS مهمة للغاية للتمثيل المرئي لموقع الويب ، فهي أداة قوية لتزيين أي موقع ويب. حتى تتمكن من استخدام ذلك مع كل شيء ، حتى وورد المواضيع ؛)
أذهب خلفها. إذا كنت لم تفهم حتى الآن بعد 4 سنوات ، تنفق نفسك بعض التعليم. أقترح بعض الكتب مثل http://oreilly.com/catalog/9780596101978 والتي تعتبر مثالية للتعليم الذاتي (بجانب الممارسة).
يتم تعريف CSS بحد ذاته بشكل جيد بواسطة W3C وكذلك HTML. لا يوجد تعريف سهل الاستخدام للغاية ولكنه صحيح ، فمع البعض يمكنك تعلم الكثير هناك أيضًا. w3schools من صنع نيس أيضًا (وهذا الموقع يجعله بطريقة ما على مر السنين ، يبدو أن بعض العقول وراءه على الأقل). HTML/CSS ، وهذا هو WWW ، الاستيلاء على المصدر الخاص بك: D
من أجل PHP يوجد php.net. بالنسبة إلى WordPress ، حسنًا ، إنه يتغير دائمًا ويستهلك موارد حياتك المهنية الشخصية ، لذلك لا تركز عليها كثيرًا. لم يتم تطويره جيدًا على أي حال ، فما عليك سوى البحث عن ما هو جيد بالنسبة لك ، ولا تركز على WordPress كثيرًا.
بقدر ما يذهب CSS ، لا يوجد الكثير من الأشياء المحددة في ووردبريس في هذا المجال. انتقل إلى w3schools وانتقل إلى دروسهم التعليمية. بقدر ما يتعلم كيفية بناء سمة ، فإن أفضل مصدرين يمكن أن أوصي بهما هما قسم مطور السمات في المخطوطة والموضوع الافتراضي (اعتبارًا من الآن ، الفان وعشرة). اقرأ خلال صفحة تطوير السمة وصفحة قوالب للحصول على مزايا جيدة الفهم الأساسي. بعد ذلك ، ما عليك سوى قراءة التعليمات البرمجية المصدر للسمة الافتراضية ، باستخدام مستندات المطور (خاصةً علامات القوالب و مرجع وظيفة صفحات) كمرجع.
آمل أن يكون هذا ساعد!
أهم شيء يمكنك القيام به هو إنشاء تثبيت WordPress محلي يمكنك اللعب به. (إرشادات لـ: Mac | Windows | Linux ) سيسمح لك ذلك بالتجربة وارتكاب الأخطاء دون أن يشاهدها بقية العالم.
أسرع طريقة للتعلم هي عن طريق تعديل السمات الموجودة وإنشاء سمات فرعية للعديد من الأطر . من بين هؤلاء ، مفضلي الشخصي هو مواضيعي . من الصعب جدًا البدء من نقطة الصفر ، لذلك يمكن أن تساعدك هذه الموارد في البدء.
لمعرفة CSS ، w3schools.com هو المورد . بالنسبة للعديد من المصممين ، Firebug هي أداة لا غنى عنها. لا تترك المنزل بدونه!
الخطوة 1: إنشاء سمة فرعية من سمة الوالدين الصلبة جيدة. أ. تثبيت السمة الموضوعية. ب. اتبع التعليمات الخاصة بهم لإنشاء سمة تابعة. (قم بنقل مجلد السمات الموضوعية التابعة للطفل خارج المجلد المواضيعي ، ضمن محتوى/الموضوعات الخاصة بـ wp. سيكون لديك الآن/wp-content/theme/المواضيعية ، و/wp-content/theme/thematic-sample- C. إعادة تسمية الدليل الأخير إلى اسم السمة المفضل الجديد الخاص بك D. انتقل إلى شاشة المظهر ، وقم بتنشيط السمة الجديدة.
الخطوة 2: تحرير الأنماط. ccs ، وتجربة CSS. أ. على سبيل المثال ، أضف:
#primary, #secondary {
background-color: #e8e8d6;
margin-right: 10px;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
padding:18px 0 0;
}
#branding {
background: url(http://example.com/wp-content/uploads/2010/09/example.jpg) top left no-repeat;
}
من الأسهل أن تبدأ بمجرد تغيير الألوان والخطوط ، ثم يمكنك الدخول في أشياء مرحة مثل الزوايا الدائرية ، والمقاطع العائمة ، إلخ.
الخطوة 3: استخدم style.css الأصلي في الدليل/wp-content/themes/المواضيعية كدليل. حقا دراسة هذا style.css. استخدم مرجعًا مثل http://reference.sitepoint.com/css للمساعدة في فهم كل قاعدة.
باستخدام سمة فرعية ، يمكنك تغيير القليل أو بقدر ما تريد. على سبيل المثال ، لن يغير البعض سوى شعار العلامة التجارية # ، كما هو موضح أعلاه. كلما حاولت ، كلما تعلمت المزيد.
لقد ساعدني هؤلاء الرجال كثيرًا (وما زالوا يفعلون) http://digwp.com/ كتابهم في الحقيقة مفيد وسهل الفهم ، وهكذا بلوق الخاصة بهم!
ذكر كيلان Firebug لفايرفوكس.
إنها أداة رائعة حقًا لمعرفة كيفية قيام الآخرين ببناء مظاهرهم.
قم بتنزيل بعض السمات الرائعة المظهر ثم استخدم Firebug لاستكشافها. ساعدني ذلك كثيرًا عندما بدأت.