2016年7月30日 星期六

style.css][CSS][woocommerce][wordpress][0630

建立子佈景主題後, 就可以在子佈景主題中更新style.css而不受主 主題更新的影響, 說是這樣說,但是有些舊的code,不知為何無法使用

css好像也沒那麼難,都在設定屬性、值,只是沒找到人性化像C++ builder之類可以直接設定屬性的工具而已

style.css的整理

1.有在用的style.css整理一下
/*  105.0629 刪除shop頁面的title 「商店」  >>定位  >ok            */
.page-title{
display: none!important;
}


/*  105.0630固定Top欄不因捲動消失  >>方便進入購物車,也可以擺MAIL之類的聯絡資料?     >>OK               */
#top {
position:fixed;
top: 30px;
z-index: 1000;
width: 100%;
}
body {
padding-top: 20px;
}
/*  105.0630 縮減header的空白區域              */
@media only screen and (min-width: 768px) {
   #header {
       padding-bottom: 0px!important;
   }
}
#header #navigation,
#header hgroup {    
   margin-top: 0px;
padding: 0px;
margin-bottom:0px;
}
#toprightwidgetarea {
   float: right;
   width: 75%;
   margin-top: -19px;
   margin-right: 12px;
   text-align:right;
}
#toprightwidgetarea aside {
   margin-bottom: 14px;
}
/* 105.0630 縮減header最下方的空白區域 */
#header,
.homepage-banner {margin-bottom:0px!important;}


2.ok但不使用的style.css
/* 105.0629 增加商品數量的寬度Change quantity input box width >>OK>>不使用 好像沒啥差別*/
.single-product .product .summary .group_table .quantity { min-width: 120px; }


.single-product .product .summary .group_table td.price { padding:0 8px 8px 0; min-width: 0px; }


.quantity .qty { border-top:1px solid #ccc; border-bottom:1px solid #ccc; -webkit-border-radius:0; -moz-border-radius:0; border-radius:0; width:16px; text-align: center; min-width: 50px; }


.woocommerce-page td.product-quantity{min-width:120px;}
/*  105.0630 增加商品陰影片,不使用,>>參考移除白框 >>OK         */
/*
.attachment-shop_catalog {
box-shadow: inset -3px -3px 5px rgba(0,0,0,0.5) !important;
border: 0!important;
}
*/


3.noOK的style.css
/*  105.0630 縮減與麵包屑的距離     >>no ok,可能不是放這,可能我取消他主題自己的麵包屑的關係?              */
/*
#breadcrumbs {
margin: 0px;
padding: 0px;
}
*/


4.準備還要改成可用的css
/*  105.0629 減少內文與側邊欄的空白區域>>會影響到full的頁面...                      */
/*
.home ul.products li.product h3 {font-size: 14px:}
.home ul.products li.product { margin-bottom:0px!important;}
@media all and (min-width: 768px) {
#main {
width: 76.2%!important;
}
}
*/
5.no OK可以修就修,不能修就算了
/* 105.0630 縮減header最上方的空白區域>>no ok */
/*
#header #navigation, #header hgroup {
margin: 0px;
padding: 0px;
}
*/
/* 105.0630 縮減header最上方的雙線區域>>no ok */
/*
#header {
margin: 0px;
padding: 0px !important;
border-bottom: 4px double transparent!important;
}
*/


6.改好的
/* 105.0630 雙線取消成功改法 找到現有程式整個照抄,只把屬性改成透明即可 */ #header { padding: 1.618em 0 0; margin-bottom: 3.631em; border-bottom: 4px double transparent!important; clear: both; position: relative; }

2016年7月1日 星期五

StackEdit][wordpress][Blog][線上軟體][1050701

StackEdit

好像是個很好的文章編輯器,
真哥先蒐集了資料,
自己是還沒實用過,
我是要找CSS的編輯器呀...

摘錄如下:

StackEdit 是一款基于 Web 技术开发的 Markdown 编辑器,它可以将编辑的文档发布到 Blogger、Wordpress,也可以与 Dropbox、Github、Google Drive 同步。