мазмун Marketing

Сиздин WordPress блогуңуз принтерге ылайыктуубу?

Кечээки постту бүтүрүп жатканда Коомдук Медиа ROI, Мен Dotster компаниясынын башкы директору Клинт Пейджге алдын-ала көз чаптырууну кааладым. Мен PDF форматына басып чыгарганда, баракча башаламан болду!

Вебсайттын көчүрмөсүн басып чыгарууну, кийинчерээк маалымдаманы же жөн гана айрым эскертүүлөр менен файлды басып чыгарууну жактырган көптөгөн адамдар бар. Блогумду принтерге ыңгайлуу кылгым келди. Бул мен ойлогондон кыйла жеңил болду.

Басма версияңызды кантип көрсөтсө болот:

Ал үчүн CSSтин негиздерин түшүнүшүңүз керек. Эң кыйын нерсе - бул CSSти жазуу үчүн, мазмунду көрсөтүүнү, жашырууну жана тууралоону текшерүү үчүн, браузериңиздин иштеп чыгуучу консолун колдонуу. Safariде сиз иштеп чыгуучу куралды иштетип, баракчаңызды оң баскыч менен чыкылдатып, Мазмунду текшерүү тандаңыз. Бул сизге байланыштуу элементти жана CSS көрсөтөт.

Safariде баракчаңыздын басып чыгарылган версиясын веб-инспектордо көрсөтүү мүмкүнчүлүгү бар:

Safari - Веб Инспекторунда Басып чыгаруу

Кантип WordPress блогуңузду принтерге ылайыкташтырууга болот:

Басып чыгаруу үчүн стилиңизди көрсөтүүнүн бир-эки жолу бар. Бири учурдагы стилдик таблицаңызга "басып чыгаруунун" медиа түрүнө мүнөздүү бөлүмдү кошуу.

@media print {
     header, 
     nav, 
     aside { 
         display: none; 
     }
     #primary { 
         width: 100% !important 
     }
     .hidden-print, 
     .google-auto-placed, 
     .widget_eu_cookie_law_widget { 
         display: none; 
     }
}

Дагы бир жолу, балаңыздын темасына басып чыгаруу параметрлерин көрсөткөн белгилүү бир стилдик баракчаны кошуу. Бул жерде:

  1. Кошумча стилдик баракчаны тема каталогуна жүктөңүз print.css.
  2. Сиздин жаңы стилге шилтеме кошуңуз functions.php файл. Print.css файлыңыз ата-энеңиздин жана балаңыздын стилдик таблицасынан кийин жүктөлүшүн камсыз кылып, анын стилдери акыркы жүктөлүшү керек болот. Ошондой эле плагинден кийин жүктөлүшү үчүн, мен бул жүктөөгө 100 приоритетин койдум, бул жерде менин шилтемеим төмөнкүдөй:
function theme_enqueue_styles() {
    global $wp_version;
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style') );
    wp_enqueue_style( 'child-style-print', get_stylesheet_directory_uri() . '/print.css', array(), $wp_version, 'print' );
}
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' , 100);

Эми print.css файлын ыңгайлаштырып, жашырылган же башкача чагылдырылган элементтердин бардыгын өзгөртө аласыз. Мен, мисалы, өзүмдүн сайтымда, мен гана көрсөтүүнү каалаган мазмун басылып чыгышы үчүн, бардык навигацияны, аталыштарды, каптал тилкелерди жана төмөнкү колонтитулдарды жашырам.

My print.css файл ушул сыяктуу. Заманбап браузерлер тарабынан кабыл алынган ыкманы дагы кошумчаладым:

header, 
nav, 
aside { 
    display: none; 
}
#primary { 
    width: 100% !important 
}
.hidden-print, 
.google-auto-placed, 
.widget_eu_cookie_law_widget { 
    display: none; 
}

Басып чыгаруу көрүнүшү кандай көрүнөт

Google Chrome'дон басылып чыкса, менин басып чыгаруу көрүнүшүм мындайча болот:

WordPress Басып чыгаруу көрүнүшү

Өркүндөтүлгөн стилдөө

Белгилей кетүүчү нерсе, бардык эле браузерлер бирдей деңгээлде түзүлбөйт. Ар бир браузерди текшерип, сиздин баракчада алардын кандайча көрүнүп жаткандыгын текшерип көрүңүз. Кээ бирлери мазмунду кошуу, чектерин жана барактын өлчөмдөрүн, ошондой эле бир катар башка элементтерди кошуу үчүн өркүндөтүлгөн баракчалардын өзгөчөлүктөрүн колдошот. Smashing Magazine журналында бир нерсе бар бул өнүккөн басма жөнүндө толук макала параметрлери.

Төмөнкү сол жагына автордук укукту эскертүү, оң жактагы барактын эсептегичин жана ар бир барактын сол жагындагы документтин аталышын кошуу үчүн барактын жайгашуусунун чоо-жайы келтирилген:

@page { 
    size: 5.5in 8.5in;
    margin: 0.5in; 
}
@page:right{ 
  @bottom-left {
    margin: 10pt 0 30pt 0;
    border-top: .25pt solid #666;
    content: "©  " attr(data-date) " DK New Media, LLC. All Rights Reserved.";
    font-size: 9pt;
    color: #333;
  }

  @bottom-right { 
    margin: 10pt 0 30pt 0;
    border-top: .25pt solid #666;
    content: counter(page);
    font-size: 9pt;
  }

  @top-right {
    content:  string(doctitle);
    margin: 30pt 0 10pt 0;
    font-size: 9pt;
    color: #333;
  }
}

Douglas Karr

Douglas Karr CMO болуп саналат OpenINSIGHTS жана негиздөөчүсү Martech Zone. Дуглас ондогон ийгиликтүү MarTech стартаптарына жардам берди, Martech сатып алууларына жана инвестицияларына 5 миллиард доллардан ашык каражатты текшерүүгө жардам берди жана компанияларга сатуу жана маркетинг стратегияларын ишке ашырууда жана автоматташтырууда жардам берүүнү улантууда. Дуглас эл аралык деңгээлде таанылган санариптик трансформация жана MarTech эксперти жана спикери. Дуглас ошондой эле Dummie's guide жана бизнес лидерлик китебинин басылып чыккан автору.

Тектеш макалалар

Артка жогорку баскычы
жакын

Adblock аныкталды

Martech Zone Бул мазмунду сизге эч кандай акы төлөбөй бере алат, анткени биз сайтыбызды жарнамадан түшкөн киреше, өнөктөштүк шилтемелер жана демөөрчүлүк аркылуу акча табабыз. Биздин сайтты көрүп жатканыңызда жарнама блокаторуңузду алып салсаңыз, биз ыраазыбыз.