Оқулық: сайтыңызға теңшелетін CSS жүйесін қосу

Сәндеу жұмыс кеңістігі қаріптер мен түстер сияқты сайтыңыздың кейбір тақырып мүмкіндіктерін өңдеуіне мүмкіндік береді, бірақ жеке реттелетін CSS тақырыптарын қолдана аласыз.

Реттелетін CSS файлын анықтап, оны сайтыңызға жүктеп салу арқылы жеке тақырыпты жасауға болады.

Бұл оқулықта келесі тапсырмалар бойынша мәліметтер беріледі:

• Реттелетін CSS файлын жүктеп салу
• Интернетке арналған Visual Studio Code бағдарламасында CSS жүйесін өңдеу

Алғышарттар

• Power Pages жазылымы немесе сынақ нұсқасы. Power Pages сынақ нұсқасын осы жерден алыңыз.
• Power Pages сайты жасалды. Power Pages сайтын жасау.
• Таңдаулы CSS өңдегіші арқылы жасалған реттелетін тақырып файлы.

Ескертпе

Сіз жасаған кез келген реттелетін тақырып Bootstrap v3 нұсқасымен үйлесімді болуы керек.

Торабыңызға теңшелетін CSS қосу

Келесі бейнеде сайтыңызға реттелетін CSS кодын қолдану жолы көрсетіледі.

Бұл мысалда веб-сайтымыздағы түймелерге көлеңке әсерлерін қосуға мүмкіндік беретін кейбір реттелетін CSS файлдарын қосамыз. Жеке реттелетін CSS файлын пайдалана аласыз немесе берілген үлгіні пайдалана аласыз.

1. Таңдаулы CSS өңдегішінде үлгі жасау үшін button_shadow.css реттелетін тақырып файлын жасап, сақтаңыз.

   .button1 {
   box-shadow: 0 9px 18px 0 #333333, 0 8px 24px 0 #333333;
    }
   

2. Power Pages торабына өтіңіз.

3. Реттелетін тақырып қосу керек сайтты таңдап, Өңдеу параметрін таңдаңыз.

4. Сәндеу жұмыс кеңістігін ашыңыз.

5. Тақырыпты таңдап, ... (көп нүкте) таңдап, CSS жүйесін басқару параметрін таңдаңыз.

   

6. Реттелетін CSS бөлімінде Жүктеп салу параметрін таңдап, реттелетін CSS файлын таңдаңыз. Тек бір CSS файлын бір уақытта жүктеп салуға болады, бірақ бірнеше файлды жүктеп салуға болады. Бірнеше CSS файлы бірдей атрибутты жаңартса, тізім астындағы CSS файлындағы атрибуттар көрсетіледі. Реттелетін CSS файлдарының ретін реттеуге болады.

7. Жаңартулардың нәтижелерін кенеп беттерінде бірден көруіңіз керек.

   

8. Реттелетін CSS файлдарының ретін өшіруге немесе жылжытуға болады. Соңғы тізімдегі файл басқаларына қарағанда басым болады.

   

9. Көп нүктені (...) таңдап, Кодты өңдеу параметрін таңдау арқылы CSS файлын тікелей өңдеуге болады. Бұл қадам Интернетке арналған Visual Code өңдегішін ашады. Өзгерістерді сақтау үшін CTRL-S параметрін таңдаңыз.

   

10. CSS жүйесін жаңартып, өзгерістерді көру үшін дизайн студиясында Синхрондау параметрін таңдаңыз.

11. Сайттағы реттелетін тақырыпты көру үшін Алдын ала көру параметрін таңдаңыз.

Ескертпе

Реттелетін тақырыпты толығымен жою үшін Порталды басқару бағдарламасындағы веб-файл жазбасын жойыңыз.