<head> Title that appears in search results <data:blog.title/> <data:messages.search/>: <data:view.search.query/> <data:blog.pageName/> - <data:blog.title/> Blog archive in: <data:blog.pageName/> Blog - <data:blog.title/> Error 404: Not Found! It will omit the blog title when the character count exceeds 57 <data:blog.pageName/> <data:blog.pageName/> - <data:blog.title/> Replace Add_your_image_url_here with your image url <style>/* */ /* THEME DETAILS: . Name : Median-UI-1.7-Blogger-Template-With-WhatsApp-Live-Chat Demo site : median-ui.jagodesain.com Powered by : jagodesain.com WhatsApp Integrated By : https://imamuddinwp.com ============================================================================ NOTE: This theme is premium (paid). You can only get it by purchasing officially. If you get it for free through any method, that mean's you get it illegally. ============================================================================ */ /* Variable */ :root{ /* var: Font */ --fontSize: $(fontSize) ; --fontHead: 'Noto Sans', sans-serif ; --fontBody: 'Noto Sans', sans-serif ; --fontBody-alt: 'Fira Sans', sans-serif ; --fontCode: 'Fira Mono', sans-serif ; --head-H1: 2rem ; --head-H2: 1.8rem ; --head-H3: 1.7rem ; --head-H4: 1.6rem ; --head-H5: 1.5rem ; --head-H6: 1.4rem ; --head-fontWg: 400 ; } .nB{ /* var: Light-mode */ --lightLink: $(themeLink) ; --lightC: $(themeC) ; --lightC-alt: $(themeC.alt)cc ; /* cc mean's opacity 80% */ --lightBg: $(themeBg) ; --lightBg-alt: $(themeBg.alt) ; --lightBg-sec: $(themeBg.sec) ; --lightBg-pop: rgb(14 20 27 / 30%) ; --lightBd-color: $(themeBd.color) ; /* var: Dark-mode */ --darkLink: $(darkLink) ; --darkC: $(darkC) ; --darkC-alt: $(darkC.alt)B3 ; /* B3 mean's opacity 70% */ --darkBg: $(darkBg) ; --darkBg-alt: $(darkBg.alt) ; --darkBg-sec: $(darkBg.sec) ; --darkBg-pop: rgb(14 20 27 / 90%) ; --darkBd-color: $(darkBd.color) ; /* var: Theme */ --themeLink: var(--lightLink) ; --themeC: var(--lightC) ; --themeC-alt: var(--lightC-alt) ; --themeBg: var(--lightBg) ; --themeBg-alt: var(--lightBg-alt) ; --themeBg-sec: var(--lightBg-sec) ; --themeBg-pop: var(--lightBg-pop) ; --themeBd-color: var(--lightBd-color) ; /* var: Basic, button, input */ --vHeight: 100vh ; --selectC: #fffdfc ; --selectBg: var(--themeLink) ; --placeHolder: var(--themeC-alt) ; --buttonC: $(buttonC) ; --buttonBg: $(buttonBg) ; --buttonBd-line: $(buttonBd.line) ; --buttonBd-color: $(buttonBd.color) ; --buttonBd-radius: $(buttonBd.radius) ; --button-maxWidth: $(button.maxWidth) ; --inputC: currentColor ; --inputBg: var(--themeBg) ; --inputBd-line: 1px ; --inputBd-color: var(--themeBd-color) ; --inputBd-radius: 4px ; /* var: Icons */ --iconWidth: 35px ; --iconHeight: 35px ; /* var: Pop-up */ --closeHeight-phone: 60px ; /* var: Header */ --headerText-after: '' ; --headerWidth-expand: var(--sideWidth-expand) ; --headerHeight: $(headerHeight) ; --headerHeight-min: -$(headerHeight) ; --headerHeight-phone: $(headerHeight.phone) ; --header-font: 1.143em ; --header-fontWg: 500 ; --headerC: $(headerC) ; --headerBg: $(headerBg) ; --headerBd-line: $(headerBd.line) ; --headerBd-radiusBL: $(headerBd.radiusBL) ; --headerBd-radiusBR: $(headerBd.radiusBR) ; --headerBd-color: $(headerBd.color) ; --headerLogo-maxWidth: $(logo.maxWidth) ; --headerLogo-maxHeight: $(logo.maxHeight) ; /* var: Sidenav */ --sideWidth: $(sideWidth.collapse) ; --sideWidth-collapse: var(--sideWidth) ; --sideWidth-expand: $(sideWidth.expand) ; --sideWidth-max: $(sideWidth.max) ; --sideMargin-phone: $(sideMargin) ; --sideC: $(sideC) ; --sideBg: $(sideBg) ; --sideBd-line: $(sideBd.line) ; --sideBd-radiusTL: $(sideBd.radiusTL) ; --sideBd-radiusTR: $(sideBd.radiusTR) ; --sideBd-radiusBR: $(sideBd.radiusBR) ; --sideBd-radiusBL: $(sideBd.radiusBL) ; --sideBd-color: $(sideBd.color) ; /* var: Sidebar */ --sidebarWidth: $(sidebarWidth) ; --sidebarPadding: $(sidebarPadding) ; --sidebarC: $(sidebarC) ; --sidebarBg: $(sidebarBg) ; --sidebarBd-line: $(sidebarBd.line) ; --sidebarBd-radius: $(sidebarBd.radius) ; --sidebarBd-color: $(sidebarBd.color) ; /* var: Content */ --content-maxWidth: $(content.maxWidth) ; --contentPost-maxWidth: $(contentPost.maxWidth) ; --contentPage-maxWidth: $(contentPage.maxWidth) ; --contentPop-maxWidth: $(contentPop.maxWidth) ; --contentPadding: $(contentPadding) ; --contentPadding-minus: -$(contentPadding) ; --contentPadding-box: $(contentPadding.box) ; --contentSpace: $(contentSpace) ; --contentC: $(contentC) ; --contentBg: $(contentBg) ; --contentBg-alt: $(contentBg.alt) ; --contentBg-sec: $(contentBg.sec) ; --contentBd-line: $(contentBd.line) ; --contentBd-radius: $(contentBd.radius) ; --contentBd-radiusA: $(contentBd.radiusA) ; --contentBd-color: $(contentBd.color) ; /* var: Footer */ --footerC: $(footerC) ; --footerBg: $(footerBg) ; --footerBd-line: $(footerBd.line) ; --footerBd-radiusTL: $(footerBd.radiusTL) ; --footerBd-radiusTR: $(footerBd.radiusTR) ; --footerBd-color: $(footerBd.color) ; /* var: Post style */ --postPadding: $(postPadding) ; --postPadding-phone: $(postPadding.phone) ; --postPadding-content: $(postPadding.content) ; --postC: $(postC) ; --postBg: $(postBg) ; --postBd-line: $(postBd.line) ; --postBd-radius: $(postBd.radius) ; --postBd-color: $(postBd.color) ; --postBs-color: $(postBs.color) ; --postBs-hoverColor: $(postBs.hoverColor) ; /* var: Post font */ --postTitle-font: 2.6rem ; --postTitle-fontPhone: 2rem ; --postTitle-fontWg: 400 ; --postTitle-fontItems: 1.2em ; --postTitle-fontItemsPhone: 1.1em ; --postDescription-font: 1.13rem ; --postDescription-fontPhone: 1.072rem ; --postBody-font: 1.143rem ; --postBody-fontPhone: 1.072rem ; /* var: Post typo */ --postBreak: 3em ; --postImageBd-radius: 2px; --lineHeight: 1.7 ; --lineSpacing: 1.8em ; --tableBg-color: rgb(246 246 246 / 80%) ; /* var: Post thumbnail */ --thumbnailRatio: 56.25% ; /* According to aspect-ratio 16:9 (divide 9 by 16 = 0.5625) */ --thumbnailRatio-box: 100% ; /* var: Post syntax */ --synC: #2f3337 ; --synBg: #f8f9fa ; --synOrange: #b75501 ; --synBlue: #015692 ; --synGreen: #54790d ; --synRed: #f15a5a ; --synGray: #656e77 ; --synGold: #72621d ; --synPurple: #803378 ; --synBd-line: 1px ; --synBd-radius: 4px ; --synBd-color: #d2d3d7 ; /* var: Post component */ --noteAfter: '\002A' ; --warnAfter: '\0021' ; --noteC: $(noteC) ; --noteBg: $(noteBg) ; --warnC: $(warnC) ; --warnBg: $(warnBg) ; /*#fef5fa*/ --stepC: $(stepC) ; --stepHover: $(stepHover) ; /* var: Widget */ --widgetTitle-font: 1.072rem ; --widgetTitle-fontWg: 400 ; --widgetTitle-afterD: inline-block ; --widgetTitle-afterWd: 10px ; --widgetTitle-afterC: var(--themeBd-color) ; --widgetTitle-space: 20px ; /* var: Widget notify */ --notifHeight: $(notifHeight) ; --notifLink: $(notifLink) ; --notifC: $(notifC) ; --notifBg: $(notifBg) ; /* var: Widget slider */ --sliderBd-radius: 4px ; --sliderRatio: 43.75% ; /* var: Widget featuredPosts */ --thumbnailSize: 300px ; /* var: Widget mobileMenu */ --mobileHeight: $(mobileHeight) ; --mobileMargin: $(mobileMargin) ; --mobileC: $(mobileC) ; --mobileBg: $(mobileBg) ; --mobileBd-line: $(mobileBd.line) ; --mobileBd-radiusTL: $(mobileBd.radiusTL) ; --mobileBd-radiusTR: $(mobileBd.radiusTR) ; --mobileBd-radiusBR: $(mobileBd.radiusBR) ; --mobileBd-radiusBL: $(mobileBd.radiusBL) ; --mobileBd-color: $(mobileBd.color) ; /* var: Widget ToC */ --tocWidth: $(tocWidth) ; --tocWidth-minus: -$(tocWidth) ; --tocMargin: $(tocMargin) ; --tocC: $(tocC) ; --tocBg: $(tocBg) ; --tocBd-line: $(tocBd.line) ; --tocBd-radiusTL: $(tocBd.radiusTL) ; --tocBd-radiusTR: $(tocBd.radiusTR) ; --tocBd-radiusBR: $(tocBd.radiusBR) ; --tocBd-radiusBL: $(tocBd.radiusBL) ; --tocBd-color: $(tocBd.color) ; /* var: Transition */ --tDuration: .1s ease ; --tShowHide: opacity var(--tDuration), visibility var(--tDuration) ; /* var: Bookmark */ --addBookmark: 'Save' ; --removeBookmark: 'Saved' ; --bookmarkTextLenght: 90px ; /* var: Custom text */ --free: 'Free!' ; --new: 'New!' ; --breadcrumbs: '\005C' ; --noImage: 'Null' ; --labelComa: 'and' ; --closeButton: 'Close' ; --pageNext: 'Next' ; --pagePrev: 'Back' ; --latestUpdate: '\21BB' ; --reply: 'Reply' ; --replies: 'Write a reply...' ; --readtimeBefore: '\00B7' ; --readtimeAfter: 'min read' ; --copyLink: 'or copy link' ; --copied: 'Copied!' ; --tableToc: 'Contents' ; } /* --- WhatsApp Button For Blogger CSS code by imamuddinwp.com --- */:root {--warna-background: #4dc247;--warna-bg-chat: #f0f5fb;--warna-icon: #fff;--warna-text: #505050;--warna-text-alt: #989b9f;--lebar-chatbox: 320px;}.sticky-button{display: flex;align-items: center;justify-content: center;position: fixed;right: 20px;bottom: 76px;width: 45px;height: 45px;background-color: #fefefe;border-radius: 20px;box-shadow: 0 10px 20px 0 rgba(30,30,30,.1);}.sticky-button a, .sticky-button label{display:flex;align-items:center;width:55px;height:55px;-webkit-transition:all .3s ease-out;transition:all .3s ease-out;}.sticky-button a svg, .sticky-button label svg{margin:auto;fill:#4dc247}.sticky-button label svg.svg-2{display:none}.sticky-chat{position:fixed;bottom:70px;right:20px;width:var(--lebar-chatbox);-webkit-transition:all .3s ease-out;transition:all .3s ease-out;z-index:21;opacity:0;visibility:hidden;line-height:normal}.sticky-chat .chat-content{border-radius:10px;background-color:#fff;box-shadow:0 2px 5px 0 rgba(0,0,0,.05);overflow:hidden}.sticky-chat .chat-header{position:relative;display:flex;align-items:center;padding:15px 20px;background-color:var(--warna-background);overflow:hidden}.sticky-chat .chat-header:after{content:'';display:block;position:absolute;bottom:0;right:0;width:70px;height:65px;background:rgba(0,0,0,.040);border-radius:70px 0 5px 0;}.sticky-chat .chat-header svg{width:35px;height:35px;flex:0 0 auto;fill:var(--warna-icon)}.sticky-chat .chat-header .title{padding-left:15px;font-size:14px;font-weight:600;font-family:'Roboto', sans-serif;color:var(--warna-icon)}.sticky-chat .chat-header .title a{color:#fff}.sticky-chat .chat-header .title span{font-size:11px;font-weight:400;display:block;line-height:1.58em;margin:0;}.sticky-chat .chat-text{display:flex;flex-wrap:wrap;margin:25px 20px;font-size:12px;color:var(--warna-text)}.sticky-chat .chat-text span{display:inline-block;margin-right:auto;padding:10px 10px 10px 20px;background-color:var(--warna-bg-chat);border-radius:3px 15px 15px}.sticky-chat .chat-text span:after{content:'Just now';display:inline-block;margin-left:15px;font-size:9px;color:var(--warna-text-alt)}.sticky-chat .chat-text span.typing{margin:15px 0 0 auto;padding:10px 20px 10px 10px;border-radius:15px 3px 15px 15px}.sticky-chat .chat-text span.typing:after, .chat-menu{display:none}.sticky-chat .chat-text span.typing svg{height:14px;fill:var(--warna-text-alt)}.sticky-chat .chat-button{display:flex;align-items:center;margin-top:15px;padding:12px 20px;border-radius:10px;background-color:#fff;box-shadow:0 2px 5px 0 rgba(0,0,0,.05);overflow:hidden;font-size:12px;color:var(--warna-text)}.sticky-chat .chat-button svg{width:20px;height:20px;fill:var(--warna-text-alt);margin-left:auto;transform:rotate(40deg);-webkit-transform:rotate(40deg)}.chat-menu:checked + .sticky-button label{-webkit-transform: rotate(360deg);transform: rotate(360deg);}.chat-menu:checked + .sticky-button label svg.svg-1{display:none}.chat-menu:checked + .sticky-button label svg.svg-2{display:table-cell}.chat-menu:checked + .sticky-button + .sticky-chat{bottom: 77px;right: 81px;opacity: 1;visibility: visible;} /*]]> *{width:50%} body#layout .mainL{width:25%} body#layout .mainR{width:75%} body#layout .blogB{width:60%} body#layout .sideB{width:40%} body#layout #HTML91 .widget-content, body#layout #HTML92 .widget-content, body#layout #HTML93 .widget-content, body#layout #HTML95 .widget-content, body#layout #HTML99 .widget-content{background-color:#f0f8ff !important} /* notif */ body#layout #notif-widget{padding:0!important} body#layout #notif-widget .widget{margin-top:0!important} body#layout #notif-widget h4, body#layout #notif-widget .layout-widget-description{display:none !important} ]]>
Paste your ad code right under this tag
Paste your ad code right under this tag
Paste your ad code right under this tag
Paste your ad code right under this tag
Additional attributes of breadcrumbs

All stories

Replace the number 0 below with 1 or 2 to show more than 2 labels
Change data:view.isPage to data:view.isSingleItem if you want to show post title in breadcrumbs
If there is a youtube video in the post Otherwise, the first picture will be taken