Како створити статички блог користећи кактус [ОС Кс]

ажурирање: Цацтус апп је укинут.

Ако не требате ЦМС и преферирате само добивање статичког сајта или блога, онда је Јекилл добар алат са којим можете рискирати. Међутим, ако вам је дражи алат са графичким корисничким интерфејсом, а не радите са алаткама командне линије, можда ћете желети да одјавите Цацтус.

Кактус је бесплатан статички генератор локације опремљени снажним алатима који вам могу помоћи градите веб локације локално, брже и лакше са модерним веб технологијама. Даје вам полазну тачку у вашем пројекту са 4 унапред дизајнирана шаблона тако да можете да покренете терен.

Док радите на вашем пројекту, Цацтус ће пратите сваку промену коју направите на вашем пројекту и аутоматски освежава прегледач тако да можете одмах да видите промене на вашем Мац-у или мобилном уређају. Он такође подржава САСС / СЦСС и Цоффесцрипт ван оквира, тако да се свака промена на овој датотеци такође аутоматски генерише.

Почети

Прво, морате преузети Цацтус са његове почетне странице, а затим покренути инсталацију. Када завршите, отворите га, видећете четири дугмета: дугме Цреате, Деплои, Едит и Превиев.

Да бисте креирали нови пројекат, кликните Цреате. Видећете 4 шаблона на располагању. За овај туторијал идемо са темом Блог. Кликните Цреате.

Од вас ће се тражити да наведете име вашег пројекта и изаберете локацију на којој постоји пројекат. Ево дајем име “Ми Авесоме Блог” за пројекат. Након тога, видећете свој пројекат већ у Кактусу.

Модифиинг Филес

Генерисани пројекат помоћу Блог обрасца сада постоји на вашем Финдеру. Сада ћемо прегледати елементе потребне за изградњу нашег блога. Идите до директоријума где се чувају ваше датотеке. Главни директоријуми које ћемо користити су Темплатес, Пагес, и Статиц директоријум. За сада прескочимо остале.

Ево шта је за сваки директоријум кратко:

• Темплатес: Садржи ХТМЛ датотеке које се понашају као шаблон, које користе ХТМЛ датотеке на страницама за надоградњу.
• Пагес: Садржи све ХТМЛ датотеке које ће постати страница са истом стазом. нпр: хелло.хтмл овде ће постати хттп://иоурсите.цом/хелло.хтмл
• Статиц: Садржи све статичке ресурсе као што су ЦСС, Јавасцрипт и слике.

Сада ћемо уредити три главне датотеке из директоријума: басе.хтмл и пост.хтмл у именику Темплатес и индек.хтмл у именику страница.

Цацтус користи Дјанго Темплате Енгине за језик темплата. Уз то, можете укључити ХТМЛ елементе из других ХТМЛ датотека, тако да не морате дуплицирати кодове. Карактеристике које се овде најчешће користе темплате инхеританце и променљива.

Да бисте видели како раде, прво отворите басе.хтмл у именику шаблона.

             % блок садржаја% Главни садржај % ендблоцк цонтент% ---   

басе.хтмл је једноставан хтмл фајл који користимо као 'скелетни' предложак. Садржи заједничке елементе нашег сајта. Можете видјети неке “блокова” тамо; Користићемо предложак детета да превазиђемо ове блокове.

Сада отворите пост.хтмл налази се у истом директоријуму са басе.хтмл.

 % проширује "басе.хтмл"% % наслова блока% титле | Кактус % ендблоцк титле% % блок садржаја% --- 
 
титле
 
хеадлине 
 
 
 % блок тело% Ово је место где је садржај поста. % ендблоцк боди% 
 --- % ендблоцк цонтент% 

Тхе пост.хтмл садржи ознаку за нашу страницу уноса на блог. На првој линији то можете да видите пост.хтмл продужава басе.хтмл. То значи да ћемо блокирати блокове на басе.хтмл са блоковима овде.

Овде такође можемо наћи варијабле, као што је титле и хеадлине. Вредности ових варијабли дефинисаћемо касније у постовима блогова.

Сада, погледајмо % блок тело% блокирати. Ово ће бити замењено предлошком за дете који садржи ставке поста на нашем блогу.

Идите у директоријум страница / порука. Ево остатка наших пост уноса.

 титле: Ми Пост Ентри хеадлине: Мој пост Наслов: Агус дате: 15-01-2015 % ектендс "пост.хтмл"% % блоцк боди% % филтер маркдовн% Лорем ипсум долор сит амет елит. Еарум, перферендис инвенторе долорем рерум и темпора синт немо иллум аб саепе, претпоставке, амет илло деленити оффициис, волуптатем макиме аткуе веро сунт. --- % ендфилтер% % ендблоцк тело% 

У уносима постова, додељујемо вредност променљивој, као што су наслов, наслов, аутор и датум. Ова вредност ће проћи када зовемо име променљиве на надређени предложак. Затим пишемо садржај нашег блога са Маркдовн-ом.

Сада ћемо отићи на индексну страницу нашег блога, отворену индек.хтмл у страницама директоријум. Садржи листу наших блогова и линк до сваког уноса. Главни код изгледа испод:

 % проширује "басе.хтмл"% % садржаја садржаја% -- 
 % за пост у постовима% 
   Наслов поста  
пост.хеадлине 
 % ендфор% 
 -- % ендблоцк цонтент% 

У овом тренутку имамо једноставан блог са две главне странице индек паге која садржи ставке блога и блог ентри паге себе.

Идите у Цацтус прозор и кликните на дугме за преглед да бисте покренули сервер. Он ће аутоматски отворити претраживач и отворити вашу веб локацију.

Стилинг Блог користећи СЦСС

Одлична карактеристика Цацтуса је да ради са САСС / СЦСС из кутије. Само спустите .сасс или .сцсс датотеке Инто тхе статиц и сваки пут када уређујете и чувате датотеке, Цацтус ће аутоматски генерисати ЦСС.

Овде ћу дати пример коришћења боотстрап-сасс-а за стилинг нашег блога. Под претпоставком да користите бовер, отворите терминал и идите до статиц директоријума нашег пројекта цд команду. Затим инсталирајте боотстрап-сасс користећи ову наредбу:

$ бовер инсталирај боотстрап-сасс-оффициал

Када се преузимање заврши, видећете а бовер_цомпонентс директоријума унутар статичког директоријума који садржи боотстрап-сасс.

Сада идите на овај директоријум: статиц / цсс. Направите сцсс датотеку, дајте јој име силе-бс.сцсс и убаците овај код.

 @импорт "… / бовер_цомпонентс / боотстрап-сасс-оффициал / пропертиес / стилесхеетс / _боотстрап"; 

Оно што код ради је да увози све из боотстрап-сасс-а. Када сачувате стиле-бс.сцсс, видећете стил-бс.цсс генерисан у истом директоријуму који садржи све стилове из боотстрап-а.

Имплементирајте свој пројекат

На крају, када је ваш пројекат спреман, можете лако да имплементирате пројекат у верзију уживо усинг Амазон С3.