Designed by Uong Jowo for Blogger (let me know your real profile) conected to Uong Jowo. Pertamag is perfect For Personal Blogs Magazine Sites, Modern and fully responsive (try resizing your browser) , And Pertamag Looks Cool And Sophisticated You Can Have Fun On The Run By Posting News, articles, Tube Videos, Photos, Links and more .. Insya Allah..
DEMO
PERTAMAG https://app.box.com/s/sf5bcsw5whky8ouxmwnugvhn72fp3z9w
Thanks for not remove DESIGNER Link on the Footer.
For Mobile device 240px adding this css below:
@media only screen and (max-width:240px){
.uj_container{width:220px;padding:0;margin:0 auto}
#uj-slider,.sidebar_uj,.footer_copyright{width:200px}
.header_logo{width:200px;margin:0 auto;text-align:center;}
.header_logo img{width:180px;margin:0 auto;}
.header-ad{display:none}
#content{padding:0;margin:0 auto;width:200px}
.content_ujowo{width:200px;float:left;padding-bottom:20px;padding-right:0;border-right:0}
.footer-widget .widget-footer{width:200px;padding:0}
.footuo_ngjwo{width:200px;overflow:hidden;padding:10px 0;color:#686868!important;margin:0 auto}
.header_search{display:none}
.header_logo{text-align:center}
#ticker-wrapper,.jo_wo-bar,.top-social-icons{display:none}
#PopularPosts1 ul{width:200px}
.single .jo-woconteu_j img{max-width:200px}
.top_menu{width:200px;margin:0;padding-left:0;padding-right:0}
#uj-menu{width:180px;margin:10px}
#mobilenav{display:inline-block;border:0;padding:7px;background:#cd2122;color:#fff}
#navi.suball{background:#333}
#search-block{display:none}
#uj-slider{width:200px;height:243px;padding:0}
#uj-slider .uj_slider{width:200px;height:243px}
#carousel{display:none}
.uj_slider .slider_img{width:200px;height:243px;overflow:hidden}
.uj_slider .slider_caption{width:200px;top:150px;padding:10px}
.uj_slider .slider_caption h3{margin-bottom:0;font-size:20px}
.inde-uj li:first-child,.inde-uj li,.line-uj li:first-child,.line-uj li,.UJ-list li:first-child,.UJ-list li{width:200px}
.UJ-list.colm,.UJ-list.colm.last{width:200px;float:left}
.line-uj li:first-child .img_styleU_jowo,.line-uj li .img_styleU_jowo,.UJ-list li:first-child .img_styleU_jowo{padding:0;width:200px;overflow:hidden}
.pijo-wo .buo-ngjowo ul li,.pijo-wo .buo-ngjowo ul li:first-child{width:49%;float:left}
.pijo-wo .buo-ngjowo ul li:nth-child(even){margin-right:0}
.uj_wo-bar .buo-ngjowo ul li .img_styleU_jowo{width:200px;height:280px;padding:0;margin:0;overflow:hidden}
.uj_wo-bar .buo-ngjowo ul li{width:200px;margin:0}
.uj_wo-bar .widget{width:200px}
#related-posts ul li{width:100%;max-width:200px}
.sidebar_uj{margin-left:0!important;border:0!important;width:200px;padding-left:0;float:left;padding:0}
.sidebar-widget .widget-area{width:200px}
.social-networks li{margin-right:7px}
ul.recentComments,.recentComments li,#tabbed-widget .tabs-wrap,#tabbed-widget{width:200px}
.footer_copyright .copyrights{float:none;text-align:center;width:90%;margin-bottom:10px}
.bottom_social_icons{float:none;text-align:center;width:100%}
#top,.header-ad{display:none}
.showpageArea{font-size:12px}
}
Pertamag Responsive Magazine Blogger Template
- Uong Jowo
- January 20, 2014
- Themes ThemesDesigned
Designed by Uong Jowo, Team Blog is a Responsive Magazine Style Blogger Template for Team, created by Uong Jowo for any type of informative blog such as a complex News Blog with multi authors, or simply informative blog, Insya Allah... You can list posts by Label(Tags) and also can list video posts.
For photo of author, you don't need edit bla.. bla..bla.. This theme is automaticaly showing author photo.
From Customize Design, you can easily change main color and background image like you want..
DEMO
TeamBlog Magazine https://app.box.com/s/6g4tep00jaxh7xiwexyh
Thanks for not remove DESIGNER Link on the Footer.
How to change background img..?
Once you’ve chosen a template, you can continue customizing the look of your blog. you can choose the background color or image for your blog and then play with the color scheme.
To start customizing your background, click on the thumbnail under Background Image, or you can upload your background...
The "Read More" Slider link is Error....!?
Copy js link below and Replace postteam_content.js file to your template :
http://yourjavascript.
replace link of flexslider js with
http://flexslider.woothemes.com/js/jquery.flexslider.js
Team Blog Responsive Magazine Blogger Template for Team
- Uong Jowo
- December 05, 2013
- Themes ThemesDesigned
Alhamdulillah... Designed by Uong Jowo, Widgetly is a magazine blogger template for news blog or any web journal & much more The theme have 3 columns layout post widget content and advertising.
It’s fully responsive design ready to any device. The theme is packed with widgetized sections, and has many features such as a headlines, a flexslider, image zoom, news Gallery, tab content sidebar and much more.
DEMO
Widgetly https://app.box.com/s/faouy3xlovdl41uv624nsoh8sv0zi47r
Thanks for not remove DESIGNER Link on the Footer.
How to show Post widget on Homepage..?
- on Dashbord Blogger Click Layout
- Edit HTML/Javascript widget
- Add your label in box content and title [ like image below ]
- Save
- Copy this Responsive CSS code below , and replace to your template
.pix_uj li .uj_thumb{width:70px;height:70px;overflow:hidden;}
@media only screen and (max-width:1219px){
#wrapper{width:986px;}
.container,#footer-widget-area{width:944px;}
.header-content{margin:0;padding:25px 21px}
#sidebar-narrow,#top{display:none}
#sidebar{float:right;width:300px;}
#logo{float:left;width:270px;}
}
@media only screen and (max-width:985px) and (min-width: 768px) {
#wrapper{width:750px;}#logo,#logo img{float:left;width:200px;}
.container,#footer-widget-area,#main-content{width:730px;}
#content,#uj-slider,.flexslider,.uj-box,.pix_uj .box-content,.UJ-list li,.UJ-list li:first-child,.inde-uj li,.uj-box li:first-child .uj_thumb{width:410px;float:left;}
.scroler li .uj_thumb .overlay,.uj-box li:first-child .overlay{width:410px;height:160px}
#content .post-body img{max-width:360px;}
.uj-box.cols-2,.uj-box.cols-2 li,.uj-box.cols-2 li:first-child{float:left;width:200px;margin-right:0}
.uj-box.cols-2 li:first-child .overlay{width:200px;height:160px}
.uj-box.cols-2 .uj_thumb .overlay:hover a.zoom{left:15%}
.uj-box.cols-2 li:first-child .uj_thumb .overlay:hover a.post-link{right:15%}
.cols-2.last-column{float:right;}
.header-content{margin:0;padding:25px 15px}
.header-content{background:transparent}
.top-nav .container{position:relative}
#sidebar{padding:0 0 0 4px;float:right;width:300px;}
}
/* Phone : 480px */
@media only screen and (max-width: 767px) and (min-width: 480px){
#wrapper{max-width:430px;width:100%!important}
#topcontrol , .ads-top,#main-nav, .ads-bottom,.home-ads, .ads-post, .today-date, .slider-caption p{display:none !important;}
header {width:420px !important;}
#mobilenav{display:inline-block;border:1px solid #ccc;padding:2px 5px;}
#navi.suball {background:#333;}
.container,#main-content , .content , #content{width:420px !important; }
.flexslider , .flexslider .slides > li ,.flexslider .slides img{height:250px !important;}
.slider-caption h2 a, .slider-caption h2{ font-size:22px;}
.single-post-thumb img { max-height:210px; }
.slider-caption{width:auto;}
.logo{float:none;text-align:center;}
#uj-slider,.uj-box,#footer-widget-area,.flexslider,.uj_slider_item{float:none;width:400px;}
#uj-slider{margin:0 auto 20px auto}.uj-box,.uj-box.cols-2,.pix_uj{margin-left:10px;}
#top{display:none}
.uj-box.cols-2,.uj-box.cols-2 .widget-content,.uj-box.cols-2 li,.uj-box.cols-2 li:first-child,.uj-box,.pix_uj .box-content,.UJ-list li,.UJ-list li:first-child,.inde-uj li,.uj-box li:first-child .uj_thumb,#tabbed-widget{float:none;width:400px;}
.uj-box.cols-2 .widget>h2{width:400px;}
.pix_uj .box-content ul li:first-child{width:400px;float:none;}
.pix_uj .box-content ul li:first-child .uj_thumb,.pix_uj .box-content ul li .uj_thumb{width:100%;float:left;}
.pix_uj .box-content ul li{width:31%;float:left;}
.uj-box.cols-2,.uj-box.cols-2 li,.uj-box.cols-2 li:first-child{float:left;width:400px;margin-right:0}
.scroler li .uj_thumb .overlay,.uj-box li:first-child .overlay{width:400px;height:160px}
#sidebar {width:400px;float:left;}
#PopularPosts2 ul{width:380px;float:left;}
#adsentop,#righttop{display:none !important;}
}
/* Phone : 320px */
@media only screen and (max-width:479px){
#topcontrol,.today-date,#main-nav,.slider-caption p,#cats-tabs-box,a.random-article{display:none;}
#wrapper{max-width:297px;width:100%!important}
.social-networks{display:none;}
#mobilenav{display:inline-block;border:1px solid #ccc;padding:2px 5px;}
#navi.suball {background:#333;}
.container,#main-content,#content,
#uj-slider,.uj-box,.flexslider{margin:0 auto 20px auto;width:277px;}
#footer-widget-area{margin:0 auto;width:277px;}
.uj-box.cols-2,.uj-box.cols-2 li,.uj-box.cols-2 li:first-child,.uj-box,.pix_uj .box-content,.UJ-list li,.UJ-list li:first-child,.inde-uj li,.uj-box li:first-child .uj_thumb{float:left;width:277px;}
.pix_uj .box-content ul li:first-child{width:277px;float:left;}
footer{padding:20px 0}
#sidebar{padding:0 0 0 0;float:left;width:277px;border-left:0;}
.fb-like-box{float:left;}
#tabbed-widget,#sidebar .widget{float:left;width:277px;}
#tabbed-widget .tabs-wrap li{width:90%;float:left;}
#PopularPosts2 ul{width:250px;float:left;}
#content .post-body img{max-width:250px;}
#logo{max-width:150px;float:left;clear:both;}
#logo img{width:150px;}
#adsentop,#righttop{display:none !important;}
#sidebar-top1 img{max-width:270px;}
}
@media only screen and (max-width:319px) {
#wrapper{width:220px;}
.head_brnews .breaking-news{display:none}
#content {float:left;width:220px;}
#sidebar{padding:0 0 0 0;float:left;width:220px;}
}
Find this old Responsive CSS:
media only screen and (max-width:1219px
......................... until...............
media only screen and (max-width:319px
The Left/Right button Slider is not work on Chrome ..?
Go to Edit Html, Find this:
#uj-slider{.........
.. until...
.uj_slider .flex-direction-nav .flex-prev{margin-right:41px}
Replace with CSS code below:
#uj-slider{position:relative;max-width:620px;width:100%}
#uj-slider .widget h2,.tabs-wrap .widget h2{display:none}
.uj_slider{margin-bottom:2px;position:relative;margin-bottom:30px;overflow:hidden;background-color:#fff}
.uj_slider_wrap{position:relative;height:350px;overflow:hidden;margin-bottom:3px;padding:0}
.uj_slider_item{max-width:620px;height:340px;overflow:hidden;width:100%}
.uj_slider .slides img{width:100%;height:auto;}
.uj_slider .slider_caption{position:absolute;padding:10px 15px;background:#cd2122;background:rgba(205,33,34,0.8);left:0;bottom:100px;color:#f5f5f5;margin-bottom:12px;z-index:99}
.uj_slider .slider_caption:after{content:"";height:3px;width:100%;background:#cd2122;background:rgba(205,33,34,0.8);overflow:hidden;display:block;left:0;position:absolute;bottom:-4px}
.uj_slider_wrap .uj_slider_item{display:none;position:relative}
.flex-direction-nav {*height: 0;}
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}
.uj_slider .slider_caption h3{margin-bottom:0;font-size:20px}
.uj_slider .slider_caption h3 a{font-family:'Oswald',serif;color:#fff}
.uj_slider .slider_caption h3 a:hover{color:#000}
.uj_slider p.caption{position:absolute;background:#000;background:rgba(0,0,0,0.7);padding:7px 14px;bottom:39px;width:385px;color:#fff;font-family:tahoma;font-size:13px;line-height:17px;z-index:99}
.uj_slider p.caption .post-meta{display:none}
.uj_slider .flex-direction-nav a{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8-5GCqqk9esWPp5Joe_Jxs8kF3BzeDPFxZEziNKBbx-p-qFM-sugmWmXyGSd3vFPW-81hpnskTmrjxXUnSz7xlF04qQq66Af0CD19C0AV-FKAFfWicur1VsodBSsZ8BXmfHXEi383_Qw/s1600/bg_direction_navs.png) no-repeat;font-size:0;width:40px;height:40px;display:block; position:absolute;bottom:5px;cursor: pointer;right:5px;z-index:99}
.uj_slider .flex-direction-nav .flex-next {background-position:100% 0;z-index:99}
.uj_slider .flex-direction-nav .flex-prev {margin-right:41px;z-index:99}
-Find this :
1. <div id='sidebar' style='width:100%;max-width:300px;float:right;'> replace with <div id='sidebar'>
2. <footer adding <div class='clear'/> like below:
<div class='clear'/>
<footer itemscope='' itemtype='http://schema.org/WPFooter'>
Need show Disqus Comment Count on Homepage of this template ? ..mail me
Widgetly Responsive Magazine Blogger Template
- Uong Jowo
- October 24, 2013
- Themes ThemesDesigned
Designed by Uong Jowo. Petromag magazine blogger themes is built for your news sites.
This Theme gives you many ways to show your posts. With a good structure and responsive layout, the viewing and reading experience is superb on all types of devices.
A feature-rich, professional media, sticky menu bar, Error 404 Page, a slider on each category page, a drop-down searching post, carousel up-down, Header newsflash Show popular stories (daily, weekly, monthly or all time), recent comments and/or recent posts in a stylish way at the top of your page, and so much more!
DEMO
PetroMag https://app.box.com/s/bec0noqjifhnpo3l7bq0
Thanks for not remove DESIGNER Link on the Footer.
Designed by Uong Jowo, Newsteam is news theme with Multi Author for Team of Blogger. This Themes to help you create your team professional news blog and get more readers! Insya Allah...
It has 3 columns, horizontal and vertical pausing scroll, feature slider, show each author photo in every posts, etc..!
DEMO
Newsteam http://www.mediafire.com/?o84tctuhd4zpmge
Thanks for not remove DESIGNER Link on the Footer.
How to create a specific element in your single and archives posts that will contain the profile picture and author name?
Go to the Edit Template HTML.
Tick the “Expand Widget Templates” box.
Find this : authorname1
Replace authorname1 with Your real author name, and Url author picture, also authorname2, 3 etc..
Look like this:
<b:if cond='data:post.author == "authorname1"'>
<img src='Url author picture'/>
</b:if>
Replace link js "goup.js" code with this <script type="text/javascript" src="http://yourjavascript.
If Attension Symbols appear on the header, find this: grid_pat.png replace with this :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjg08c0ZI-iZnd11qpH4MBC-VxrJCXKUWCTRVauVL9tN6kk9jd3P3JP_ALPEYBjNLQQWzCjsINJQiCohbULfmsc7NkHf0xY4EflQP8zWR8cel8XcL5NbehyfWNzw20zA8MzW_R4N78ehCJy/s1600/grid_pat.png
Find this too: prevbn.gif and nextbn.gif
Replace with:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8DU1QtTorJrF-_4F16cnZuVkVXvwNkzgToUlsCwi3E44YjGIb6lq3h92YmjZZSq5PfqenKe5F_4yYEyTHtLCHTGc9g-cFCH3e9kdrtvCoK2-LPtmDd5rbs0B-HQa4D3hhmVKEGpE101jj/s1600/prevbn.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsOE1LFidShmAaAFYl3av7x9ml6FQpbystZnQlhp-kcoJLAMAEUS18norkl2eueyGdxsOrVNFsvGwdZ1WSebH9LSnAtGKPpiTSw3EYsoW49d85COxOHBrNTN5cUS7KVVojK8rRqHGmD-FQ/s1600/nextbn.gif
This template has 2 columns, Vertical slider tabs , headline, drop-down menus, Tipst gallery posts, carousel post image etc.. You can even add a customized background image or background color.
DEMO
TrendMag http://www.mediafire.com/?xfsi94mzmyybz4i
Thanks for not remove DESIGNER Link on the Footer.
Not work in the Chrome ??
Follow this instructions:
1. Go to Edit Html, find this:
#navi ul.items li a ...until.. #navi ul.items li also .datetime
2. Replace with :
#navi ul.items li a {display:block; font-weight: normal; overflow: hidden;height:80px; padding:5px 5px 10px;border-bottom:0.5px solid #ccc; -moz-transition:.8s linear; -webkit-transition:.8s ease-out; transition:.8s linear;font-size: 14px;font-family:Oswald;}
#navi ul.items li a:hover,#navi li a.current {background:#f7f7f7;text-decoration:none; border-bottom:0.5px solid #eee; -moz-transition:.01s linear; -webkit-transition:.01s ease-out; transition:.01s linear;}
#navi ul.items li p{font-size:11px;color:#555;font-weight: normal;}
#navi li h5{float: left;width: 180px; font-size: 15px;}
#navi ul.items li {display:block;float: left; padding:0; width: 330px; overflow: hidden;height:80px;margin:0; border-bottom:0.5px solid #eee; }
.datetime { text-align:left; float:left;background:#333;padding:0px 7px;margin-top:5px;width:180px;}
3. Save
If Atention Symbol appear, find this : up.png , tipsy.gif
Replace with:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdzdtYYmNaK0H-r5rTad4ToNI9yd1I9t8DWkrPXqBREkUslGnAP0uxXCbOIzudIew6ZAc70dJAL3vgno_2e0qXzR96X0opw4gfqGcIT9s-v7vm-L4nXQ1ulwndYkwVcRygB85ufjjYFW4/s1600/up.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZJ7E1kIegC3Tz7M57MRWVCzd9u-MuvOGIppPid7eUKq7FKb2X37K7wL28QBalWj-MjCzb2IwfmSjHjetFEvrqu8_C61FCm-gtRCzq3WVymYWMI6plywFvHQUcRydovFoq8qOEsuMnqRg/s1600/tipsy.gif
Designed by Uong Jowo, Alhamdulillah..... More Than News Theme is designed to news magazine blogger template. The home page features a 2-3 column layout ideal for content and advertising.
The theme is packed with widgetized sections, and has many unique features such as a search bar, a breadcrumb style menu, a news slider, featured Carousel, news Gallery, tab content sidebar and much more.
DEMO
MoreThan News [2] http://www.mediafire.com/?25mkfjq7e6cjmyc
Thanks for not remove DESIGNER Link on the Footer.
if Attention Symbol appear, find: up.png , dots_pat.png , and tipsy.gif
replace with :
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdzdtYYmNaK0H-r5rTad4ToNI9yd1I9t8DWkrPXqBREkUslGnAP0uxXCbOIzudIew6ZAc70dJAL3vgno_2e0qXzR96X0opw4gfqGcIT9s-v7vm-L4nXQ1ulwndYkwVcRygB85ufjjYFW4/s1600/up.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFSZIgFMfXXeGb-5yzyuMCHlk1aXw0BXVUaSUXwTke8nJLv6zXvTA88OWtXghfZ3sRMg03jmriyF2Mv7Zlp-4zqK9oCkP6GKo77xnVXM1P0wFNFfmpXVvDfRurtUXe5seOF6dSCGz0vUQ/s1600/dots_pat.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZJ7E1kIegC3Tz7M57MRWVCzd9u-MuvOGIppPid7eUKq7FKb2X37K7wL28QBalWj-MjCzb2IwfmSjHjetFEvrqu8_C61FCm-gtRCzq3WVymYWMI6plywFvHQUcRydovFoq8qOEsuMnqRg/s1600/tipsy.gif
Designed by Uong Jowo, News Cafe is Light Magazine style blogger template. This theme is great for online Newspaper, Magazine, Business and Tourism blog.
It comes with a lot of Features and design, like:
Black and white thumbnail image on home page.
Image zoom with true color image.
3 content Slider include flexslider , Horizontal column drop down menu on top, sidebar Tabs , etc..
Note: Thanks to WooThemes for free flexslider.
View Demo
News Cafe http://www.mediafire.com/?gxzmdpafcsg35bf
Thanks for not remove DESIGNER Link on the Footer.
News Magazine Theme 640 has converted to Blogger template by Uong Jowo.
Demo
News Magazine Theme 640 to Blogger Template
- Uong Jowo
- December 14, 2012
- Themes ThemesConverted
Daily theme is a Premium wordpress theme released by themejunkie.
Daily theme has converted to blogger template by Uong Jowo.
Demo
Daily v2.0 theme to Blogger template
- Uong Jowo
- December 10, 2012
- Themes ThemesConverted
Hi friends... This is Goodnews Responsive WordPress news and magazine theme fully customizable created by Momizat Theme
Goodnews has an extensive theme options with import/export System , WPML Ready, RTL full support.
Goodnews theme has converted to blogger template by Uong Jowo.
Goodnews Wp theme to Responsive Blogger template
- Uong Jowo
- December 10, 2012
- Themes ThemesConverted
This theme has converted to Blogger Template by Uong Jowo.
Demo
Follow this instruction:
1. if you have edit widget tab (Popular and Label), Go to Edit Html
find this
.tab_sidebar_list
look like: .tab_sidebar_list { display: ; }
adding this: "none"
look like: .tab_sidebar_list { display: none; }
2. Find this too: #nav ul
look like: #nav ul{list-style:none;}
adding : z-index number
look like: #nav ul{list-style:none;z-index:9999;}
Yamidoo First Theme to Blogger Template
- Uong Jowo
- November 26, 2012
- Themes ThemesConverted
This Theme has converted to Blogger template by Uong Jowo.
The theme makes it easy to create a dynamic news portal using Blogspot.
View Demo
Who’s Who Wp theme to Blogger template
- Uong Jowo
- November 14, 2012
- Themes ThemesConverted
With 7 alternate styles and advanced theme control panel options the theme gives ability to run a Newspaper or Magazine style website.
This theme has converted to blogger template by Uong Jowo.
Demo
Follow this Instruction:
Go to Template edit HTML
Find this : <ul id='mid-slider-pagination'>
Adding this One : <li><a href='#'>Label-5</a></li> Above </ul>
Save.
BlogNews Wp theme to Blogger Template
- Uong Jowo
- November 07, 2012
- Themes ThemesConverted
About Me
- Uong Jowo
- Uong Jowo was Born In Surabaya, March 1971. I'm A Blogger Templates Designer and a Converter Wp Themes to Blogger Template.