Как да улесним кодърския ни живот със Sublime Text 2

Днес (на 21. Март 2013) в init Lab ще проведем workshop за това как да улесним живота си използвайки хитрините които ни предоставя Sublime Text 2.

Ето ги и слайдовете за презентацията:

 

 

Update на WooCommerce до версия 2 и липсваща информация за продукт в front-end-а

WooThemes пуснаха новият WooCommerce 2.0 наскоро и ъпдейтването изглеждаше доста съблазнително с новия интерфейс и другите красоти в него.

Все пак ъпдейтването не е най-доброто нещо което може да се направи особено ако темата ти е направена за 1.6

Като резултат – след ъпдейта информация като цена и подобни липсваше на началната страница на сайта по някаква причина. Разбира се в администрацията всичко изглеждаше окей и очебийният извод е, че начинът по който е направена темата (дело на самите WooThemes) не работи с новата версия. Също така проверих, но все още нямаше ъпдейт за тази тема.

Хората които са писали тема за по-старата версия най-вероятно са използвали класът WC_Product за да вземат данните за определен продукт. Проблемът тук е, че вече не може да създадете такава инстанция по postID. Най-вероятно това е свързано с новосъздадената функция get_product(), която е слабо документирана в официалната документация и никъде не се упоменава, че заменя конструктора на WC_Product класа.

В моя случай в темата направена от WooThemes имах следния код:

//inside the loop
$_product = &new WC_Product( $loop->post->ID );

Това явно не работеше и за това го смених с новата функция get_product()

$_product = get_product(  $loop->post->ID );

Това е.

Според мен би било добре ако те си ъпдейтваха поне собствените wp теми за да поддържат новата версия.

Дати, време и iOS Safari

Safari на iOS е един от най-добрите мобилни браузъри. Въпреки това има едно нещо в него, което често ме кара да се чудя защо web-app-а ми не работи – JS Date обектът.

Във всеки нормален браузър можеш да създадеш Date обект от низ просто така:

var myDate = new Date('2013-01-21T13:46:20');

Но в Safari (iOS) това просто дава JS грешка.

За да го оправите трябва да използвате добрия стар split() и да направите нещо като това:

//First we split the date string
var iosDateArr = '2013-01-21T13:46:20'.split('[- :T]');
//And use the constructor with 6 args
cDate = new Date(arr[0], arr[1]-1, arr[2], arr[3], arr[4], arr[5]);

Забележете че месеца е намален с 1. Това е защото в този конструктор месеците започват от 0 за Януари и са до 11 за Декември.

Успех с JS програмирВането и по-малко подобни проблеми :)

Да помогнем на Камен от StartUP

Наскоро разбрах, че мой приятел – Камен Сарафов е болен от рядка форма на рак.

Пичът е стойностен човек, който помага усилено за стартъп обществото в България и ще е нелепо да загубим такава личност.

Повече информация на сайта му – kamensarafov.com, а може и директно да дарите през PayPal.

Вече има и дарителки номер – ако искате да помогнете изпратете смс с текст DMS KAMEN на 17 777 на цена 1 лв.

Get Responsive in 30 minutes (или как да направя wp темата си подходяща за мобилни устройства)

Ето и презентацията ми от WordCamp2012.

Смятам в близко бъдеще да допълня тук някои коментари, код и screenshots.

WordCamp София 2012

WordCamp София 2012 наближава (20-ти Септември) и аз съм поканен да говоря за responsive design и WordPress (Темата е Get Responsive in 30 minutes). Ако мислите да дойдете може да напишете в коментарите нещо, което наистина бихте искали да чуете от мен там.

Чиърз!

Geolocation на html5 app не работи ако е във fullscreen mode на iOS6

Тези дни видях поредния проблем на iOS6 относно webapps – просто не можеш да използваш getCurrentPosition() ако апликейшъна е добавен на началния екран. Функцията просто виси и не вика никой от callback функциите които са и подаден (нито error, нито success).

Изглежда, че това се случва само ако апликейшъна е във fullscreen mode – т.е. следния мета таг е добавен:

<meta content="yes" name="apple-mobile-web-app-capable" />

Решение?
Махнете го… (lame)

За да подобрите ползваемостта може да скриете address bar-а когато страницата зареди. И гугъл правят същото в html5 версията на google maps. (Работи само при телефони, които като скролнеш се скрива address bar-a).
Само добавете:

    window.scrollTo(0, 1);

Ако бях малко по-подозрителен бих си помислил, че е поредното анти-гугъл-мапс-нещо.

Фолоу ми! :)

Добавяне на нова валута в WooCommerce

Изглеждаше ми, че добавянето на нова валута (като лв. например) би било лесно с WooCommerce, но не би. Не можах да намеря никакъв wp filter в документацията

Все пак успях да намеря 2 филтъра (явно недокументирани) за тази задача: ‘woocommerce_currencies’ и ‘woocommerce_currency_symbol’. Добавянето на BGN става по следния начин:

add_filter( 'woocommerce_currencies', 'add_bgn_currency' );
function add_bgn_currency( $currencies ) {
 $currencies['BGN'] = __( 'Bulgarian lev', 'woocommerce' );
 return $currencies;
}
add_filter('woocommerce_currency_symbol', 'add_bgn_currency_symbol', 10, 2);
function add_bgn_currency_symbol( $currency_symbol, $currency ) {
 switch( $currency ) {
 case 'BGN': $currency_symbol = 'лв.'; break;
 }
 return $currency_symbol;
}

След като добавите този код в списъка с валутите в админситрацията на WooCommerce ще ви се появи и заветния лев (най-отдолу):

WooCommerce Currency Settings

WooCommerce Currency Settings

Все пак един проблем продължава да стои отворен – позицията на символа за валута не може да се управлява от hook/filter. Единственото, което може да направите е да го зададете за целия сайт. (Дори локализиращите настройки с WPML не предоставят тази опция. И дори тази конфигурация е поставена на не-толкова-интуитивно място:

Продължавам да се чудя как да го направя с php only. В краен случай може да пробвам с good old JS.


Мултиезичен slider с qtranslate

Да направиш многоезичен сайт с WordPress изглежда като piece of cake на пръв поглед. И в повечето случаи наистина е така. Qtranslate предоставя доста удобна функционалност за тази задачка.

Единственото нещо, което считах за трудност е как да се направи мултиезичен слайдър за определен сайт, но го измамихме!

Първият и основен проблем е, че featured image в WP е само един. За щастие има плъгин, позволяващ добавяне на още такива картинки за желаните post types. Съответно решението е:

  1. Сваляте и си инсталирате плъгина от страницата му там
  2. Добавяте си следния код в темата ви (functions.php за предпочитане)
if (class_exists('MultiPostThumbnails')) {
  $type = 'slides_options';

  $thumb = new MultiPostThumbnails(array(
    'label' => 'Secondary Image',
    'id' => 'secondary-image',
    'post_type' => $type
    )
  );
}
add_image_size('nivo-secondary-image-thumbnail', 960, $nivo_h, true );

Тук slides_options ви е custom post type-а, който използвате за слайдъра. Ако използвате обикновени постове заместете директно ‘post’.

Честито! Вече темата ви поддържа повече от 1 featured image.

Сега само остана да накараме WordPress да показва коректния слайд в зависимост от това кой е езикът.

За целта добавяме функция, която в зависимост от това дали е използван езикът по подразбиране изпозва featured или secondary изображението.

function qtranslate_slide() {

 global $post, $q_config;

 $image_id = get_post_thumbnail_id();
 $language = qtrans_getLanguage();
 $upload_dir = wp_upload_dir();
 $image_data = wp_get_attachment_metadata($image_id);
 if ($q_config['default_language'] != $language) {
 if (class_exists('MultiPostThumbnails') && MultiPostThumbnails::has_post_thumbnail('slides_options', 'secondary-image')) :
 MultiPostThumbnails::the_post_thumbnail('slides_options', 'secondary-image', NULL, 'nivo-secondary-image-thumbnail');
 endif;
 }
 else {
   if (file_exists($upload_dir['basedir'].'/'.$image_data['file'])) {
   $image_url = wp_get_attachment_image_src($image_id,'full', true);
   return $image_url;
  }
 }
}

Сега ни остава само където показваме слайдъра да заместим

$thumbnail = wp_get_attachment_image_src(some, arguments, here);

с

$thumbnail = qtranslate_slide();

Тук вече може да използвате $thumbnail[0] за url адреса на съответното изображение.

И дац ит!

Как да действаме против ACTA?

Ще си спестя обяснения какво е ACTA и какви могат да са последствията от подобен закон. За подобна информация прочетете мнението на някой блогър (http://blog.peio.org/?p=7611http://yurukov.net/blog/2012/01/27/acta-ili-kak-se-obirat-choveshki-pra/ енд соу он).

Пиша за да ви помогна да изпратите мейл на българските представители в ЕП. Толкова просто колкото да натиснеш бутона.

 

 

Сложете това на сайта си като копирате следното:
<a href="mailto: [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]; [email protected]?subject=Против ACTA&body=Представители в ЕП,%0A%0AАз съм против ратифицирането на ACTA тъй като считам, че това накърнява правото ми на информацираност и личната ми неприкосновеност, гарантирани от конституцията на Република България!%0A%0AКажете не на ACTA!"><img src="http://shtrak.eu/ninio/files/2012/01/Acta-300x116.png" alt="" title="Acta" width="300" height="116" /></a>