Shopify Free Trial Apply
Shopify 60天试用
Shopify 14天试用
WordPress

WordPress

WordPress建站及WordPress SEO相关话题
Shopify

Shopify

Shopify建站及Shopify SEO相关话题
Google SEO

Google SEO

Google SEO相关话题
SEM

SEM

SEM相关话题
Zoho

Zoho

Zoho SAAS相关产品使用话题讨论
EDM

EDM

讨论Email Marketing相关话题
Symantec SSL

Symantec SSL

讨论Symantec SSL安全相关话题
隽永东方售后服务

隽永东方售后服务

隽永东方售后服务专区

Wordpress 更改JPEG图片的压缩质量

WordPressBob 发表了文章 • 1 个评论 • 152 次浏览 • 2018-11-05 11:45 • 来自相关话题

默认情况下,WordPress会针对用户上传的图片进行质量压缩,以提高用户体验,一级手机端的浏览速度。默认图片质量都是压缩到90%,自WordPress 4.5的版本以后,图片质量压缩为82%。虽然速度提升了一点,但是图片确实灰常的模糊,看不清。
WordPress提供了 jpeg_quality 的钩子,我们可以自定义上传图片质量的压缩比列。比如:
function ed_custom_jpeg_quality() {

return 90;}

add_filter( 'jpeg_quality', 'ed_custom_jpeg_quality');这里的90我们可以随意更改,如果不希望压缩,可以改成100. 查看全部
默认情况下,WordPress会针对用户上传的图片进行质量压缩,以提高用户体验,一级手机端的浏览速度。默认图片质量都是压缩到90%,自WordPress 4.5的版本以后,图片质量压缩为82%。虽然速度提升了一点,但是图片确实灰常的模糊,看不清。
WordPress提供了 jpeg_quality 的钩子,我们可以自定义上传图片质量的压缩比列。比如:
function ed_custom_jpeg_quality() {

return 90;}

add_filter( 'jpeg_quality', 'ed_custom_jpeg_quality');
这里的90我们可以随意更改,如果不希望压缩,可以改成100.

wow.js为网站增色

WordPressLeo 发表了文章 • 2 个评论 • 151 次浏览 • 2018-11-02 08:42 • 来自相关话题

不多说先看效果
http://igeelee.dfsj.net/
http://sunbright.dfsj.net/  
是不是觉得很有趣,这样小小的一款插件就能做出这么多动画效果。
一些小小的细节效果能为网站增色不少,下面就让我们来学习如何使用这款插件。
 
首先可以参考这篇教程
https://www.eastdesign.net/juanyongdongfangimaginationinspirationshowtime2017518/
1、引入文件

<link rel="stylesheet" href="animate.min.css">
<script src="wow.min.js"></script>
2、HTML

<div class="wow slideInLeft"></div>
<div class="wow slideInRight"></div>

可以加入 data-wow-duration(动画持续时间)和 data-wow-delay(动画延迟时间)属性,如:

<div class="wow slideInLeft" data-wow-duration="2s" data-wow-delay="5s"></div>
<div class="wow slideInRight" data-wow-offset="10"  data-wow-iteration="10"></div>
(具体动画效果,可以在animate.css中找,动画效果很多,根据实际需求来)
3、JavaScript
new WOW().init();   //这种方法,有局限,移动端会出现横向滚动条

如果需要自定义配置,可如下使用:(推荐这种方法,移动端perfect)
var wow = new WOW({
    boxClass: 'wow',
    animateClass: 'animated',
    offset: 0,
    mobile: true,
    live: true
});
wow.init(); 查看全部
不多说先看效果
http://igeelee.dfsj.net/
http://sunbright.dfsj.net/  
是不是觉得很有趣,这样小小的一款插件就能做出这么多动画效果。
一些小小的细节效果能为网站增色不少,下面就让我们来学习如何使用这款插件。
 
首先可以参考这篇教程
https://www.eastdesign.net/juanyongdongfangimaginationinspirationshowtime2017518/
1、引入文件

<link rel="stylesheet" href="animate.min.css">
<script src="wow.min.js"></script>
2、HTML

<div class="wow slideInLeft"></div>
<div class="wow slideInRight"></div>

可以加入 data-wow-duration(动画持续时间)和 data-wow-delay(动画延迟时间)属性,如:

<div class="wow slideInLeft" data-wow-duration="2s" data-wow-delay="5s"></div>
<div class="wow slideInRight" data-wow-offset="10"  data-wow-iteration="10"></div>
(具体动画效果,可以在animate.css中找,动画效果很多,根据实际需求来)
3、JavaScript
new WOW().init();   //这种方法,有局限,移动端会出现横向滚动条

如果需要自定义配置,可如下使用:(推荐这种方法,移动端perfect)
var wow = new WOW({
    boxClass: 'wow',
    animateClass: 'animated',
    offset: 0,
    mobile: true,
    live: true
});
wow.init();

基于对隽永智库的积极贡献给予隽永东方 Leo 现金红包奖励

隽永风采Eastern_Design_Studio 发表了文章 • 0 个评论 • 165 次浏览 • 2018-11-01 10:07 • 来自相关话题

基于对隽永智库的积极贡献给予隽永东方 Leo 现金红包奖励,也鼓励其他小伙伴们再接再厉。
 





 
基于对隽永智库的积极贡献给予隽永东方 Leo 现金红包奖励,也鼓励其他小伙伴们再接再厉。
 

TIM图片20181101100509.png

 

推荐俩款辅助WPBakery Page Builder的免费插件

WordPressLeo 发表了文章 • 2 个评论 • 178 次浏览 • 2018-11-01 08:54 • 来自相关话题

第一款插件:Mega Addons For Visual Composer 这个插件激活人数5W+,里面包括了很多常用的功能,可以使用






第二款插件:Unlimited Addons for WPBakery Page Builder   这个插件激活人数也有1W+​





 
一些特殊页面需要客户能够更方便的操作,那么使用这种可视化编辑插件还是很Userbility的,而WPBakery Page Builder插件本身可能自带的一些功能不是很丰富,这时候我们就可以安装这些补丁插件了 查看全部
第一款插件:Mega Addons For Visual Composer 这个插件激活人数5W+,里面包括了很多常用的功能,可以使用

1.png


第二款插件:Unlimited Addons for WPBakery Page Builder   这个插件激活人数也有1W+​

2.png

 
一些特殊页面需要客户能够更方便的操作,那么使用这种可视化编辑插件还是很Userbility的,而WPBakery Page Builder插件本身可能自带的一些功能不是很丰富,这时候我们就可以安装这些补丁插件了

ftp上传文件,覆盖错项目了怎么办,首先不要急

WordPressLeo 发表了文章 • 1 个评论 • 169 次浏览 • 2018-10-26 13:50 • 来自相关话题

我们平时做项目的时候,经常会为了方便,同时打开多个ftp,一个不小心就串项目了,覆盖错了。这时候就体现了平时做备份的好处,测试站项目必须和我们文件服务器做好同步,这样即使负责该项目的同事不在,你也可以进行恢复。
那么如果是客户的正式站呢,这个首先你要想自己有没有给这个站点做过本地的备份,如果本地没有备份,你也不要急,可以看看cpanel这种控制平台有没有设置过备份、阿里云有没有设置过镜像,如果连这种备份都没做,那就完了。
如果仅仅是覆盖了样式表,那么你还能从cloudflare上面入手(这时候就更加明显的体现了加载第三方cdn的好处),切记不要手滑清了缓存,如果连缓存都清除了,那就真的玩完。
 
当然这不是鼓励大家串项目了。
我们做任何事情都要仔细。经验之谈,都是我犯过的事
 
总而言之:备份很重要,cloudflare也很有效
 
另外和我们文件服务器做好同步,需要你本地打开drive这个软件,然后创建和我们文件服务器的连接,选择你想同步的项目,本地选择一个目录作为cloudstation目录,里面就是放文件服务器同步的项目,你做任何修改都会同步到文件服务器,这是所有测试站点都要做的。(我发现新同事还是没有这个习惯) 查看全部
我们平时做项目的时候,经常会为了方便,同时打开多个ftp,一个不小心就串项目了,覆盖错了。这时候就体现了平时做备份的好处,测试站项目必须和我们文件服务器做好同步,这样即使负责该项目的同事不在,你也可以进行恢复。
那么如果是客户的正式站呢,这个首先你要想自己有没有给这个站点做过本地的备份,如果本地没有备份,你也不要急,可以看看cpanel这种控制平台有没有设置过备份、阿里云有没有设置过镜像,如果连这种备份都没做,那就完了。
如果仅仅是覆盖了样式表,那么你还能从cloudflare上面入手(这时候就更加明显的体现了加载第三方cdn的好处),切记不要手滑清了缓存,如果连缓存都清除了,那就真的玩完。
 
当然这不是鼓励大家串项目了。
我们做任何事情都要仔细。经验之谈,都是我犯过的事
 
总而言之:备份很重要,cloudflare也很有效
 
另外和我们文件服务器做好同步,需要你本地打开drive这个软件,然后创建和我们文件服务器的连接,选择你想同步的项目,本地选择一个目录作为cloudstation目录,里面就是放文件服务器同步的项目,你做任何修改都会同步到文件服务器,这是所有测试站点都要做的。(我发现新同事还是没有这个习惯)

Microsoft Edge 浏览器转 ie浏览器

其他Leo 发表了文章 • 1 个评论 • 194 次浏览 • 2018-10-25 15:04 • 来自相关话题

现在win7还是win10开始,电脑上要找个ie浏览器,我个人经验是不太容易的,当然你可以去网上下载,但其实我们电脑上是有ie了,可以通过Microsoft Edge浏览器转ie浏览器打开,而Microsoft Edge这个浏览器就很容易找到 查看全部

1.png

现在win7还是win10开始,电脑上要找个ie浏览器,我个人经验是不太容易的,当然你可以去网上下载,但其实我们电脑上是有ie了,可以通过Microsoft Edge浏览器转ie浏览器打开,而Microsoft Edge这个浏览器就很容易找到

初步seo优化小结

WordPresschad 发表了文章 • 3 个评论 • 254 次浏览 • 2018-10-24 11:50 • 来自相关话题

最近做了下自己负责的项目的优化,小有收获,不敢独享特拿来分享。
一.最重要的一点莫过于图片的压缩。
图片压缩基本分三步走:1.手动用photoshop压缩,快捷键Ctrl+alt +shift+s,即是保存为web格式。图片可以选择png或者jpg格式,对于那种应该选择哪种格式,度娘那里都有介绍,我就不多赘述。一般质量80%就可以满足需求了。2.将保存的图片通过第三方压缩网站再次压缩https://tinypng.com/   最后下载的图片大小即可上传到网站后台。3.通过wordpress后台安装的插件EWWW img optimizer再次压缩。
二.WP rocket 插件的设置。
这里要根据不同网站,设置成不同的数值,因为如果随便文件都压缩的话,可能导致网站出现乱码情况,所以调整的时候要随时观察站点页面。总之一句话:能压缩的都压缩,最大化压缩网站文件。不废话直接上图:
























注意对于preload选项的设置,我在Prefetch DNS Requests设置了相应的资源之后,移动端的评分高达98分,所以这个挺关键的。
三.WordPress 设置浏览器端缓存,加快访问速度.
在网站根目录(即是服务器public_html文件夹下面) .htaccess 文件中添加以下代码:
#Expire Header
ExpiresActive on //开启缓存
ExpiresByType text/css "access 1 month"//css文件缓存1个月
ExpiresByType text/plain "access 2 days"//纯文本内容缓存2天
ExpiresByType text/html "access 2 days"//html文件缓存2天
ExpiresByType application/javascript "access 1 month"//JS文件缓存1个月
ExpiresByType image/jpeg "access 1 month"//jpeg图片缓存1个月
ExpiresByType image/x-icon "access 1 month"//icon缓存1个月
ExpiresByType image/gif "access 1 month"//gif图片缓存一个月
ExpiresByType image/png "access 1 month"//png图片缓存一个月
ExpiresByType image/ico "access 1 month"//ico缓存1个月
ExpiresByType application/pdf "access 1 month"//pdf文件缓存一个月
ExpiresByType application/x-shockwave-flash "access 1 month"//flash缓存一个月
ExpiresDefault "access 1 month"// 默认(未提及的可缓存文件)缓存1个月
 
 
当然具体code干货代码,我也私下保存了一份(复制在.htaccess文件里面):

# BEGIN WP Rocket v3.1.4
# Use UTF-8 encoding for anything served text/plain or text/html
AddDefaultCharset UTF-8
# Force UTF-8 for a number of file formats
<IfModule mod_mime.c>
AddCharset UTF-8 .atom .css .js .json .rss .vtt .xml
</IfModule>
# FileETag None is not enough for every server.
<IfModule mod_headers.c>
Header unset ETag
</IfModule>
# Since we’re sending far-future expires, we don’t need ETags for static content.
# developer.yahoo.com/performance/rules.html#etags
FileETag None
<IfModule mod_alias.c>
<FilesMatch "\.(html|htm|rtf|rtx|txt|xsd|xsl|xml)$">
<IfModule mod_headers.c>
Header set X-Powered-By "WP Rocket/3.1.4"
Header unset Pragma
Header append Cache-Control "public"
Header unset Last-Modified
</IfModule>
</FilesMatch>
<FilesMatch "\.(css|htc|js|asf|asx|wax|wmv|wmx|avi|bmp|class|divx|doc|docx|eot|exe|gif|gz|gzip|ico|jpg|jpeg|jpe|json|mdb|mid|midi|mov|qt|mp3|m4a|mp4|m4v|mpeg|mpg|mpe|mpp|otf|odb|odc|odf|odg|odp|ods|odt|ogg|pdf|png|pot|pps|ppt|pptx|ra|ram|svg|svgz|swf|tar|tif|tiff|ttf|ttc|wav|wma|wri|xla|xls|xlsx|xlt|xlw|zip)$">
<IfModule mod_headers.c>
Header unset Pragma
Header append Cache-Control "public"
</IfModule>
</FilesMatch>
</IfModule>
# Expires headers (for better cache control)
<IfModule mod_expires.c>
ExpiresActive on
# Perhaps better to whitelist expires rules? Perhaps.
ExpiresDefault                          "access 1 month"
# cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
ExpiresByType text/cache-manifest       "access plus 0 seconds"
# Your document html
ExpiresByType text/html                 "access 2 days"
# Data
ExpiresByType text/xml                  "access plus 0 seconds"
ExpiresByType application/xml           "access plus 0 seconds"
ExpiresByType application/json          "access plus 0 seconds"
# Feed
ExpiresByType application/rss+xml       "access plus 1 hour"
ExpiresByType application/atom+xml      "access plus 1 hour"
# Favicon (cannot be renamed)
ExpiresByType image/x-icon              "access 1 month"
# Media: images, video, audio
ExpiresByType image/gif                 "access 1 month"
ExpiresByType image/png                 "access 1 month"
ExpiresByType image/jpeg                "access 1 month"
ExpiresByType video/ogg                 "access plus 1 month"
ExpiresByType audio/ogg                 "access plus 1 month"
ExpiresByType video/mp4                 "access plus 1 month"
ExpiresByType video/webm                "access plus 1 month"
ExpiresByType image/ico                 "access 1 month"
# HTC files  (css3pie)
ExpiresByType text/x-component          "access plus 1 month"

# Webfonts
ExpiresByType application/x-font-ttf    "access plus 1 month"
ExpiresByType font/opentype             "access plus 1 month"
ExpiresByType application/x-font-woff   "access plus 1 month"
ExpiresByType application/x-font-woff2  "access plus 1 month"
ExpiresByType image/svg+xml             "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
ExpiresByType application/pdf                 "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
# CSS and JavaScript
ExpiresByType text/css                  "access 1 month"
ExpiresByType application/javascript    "access 1 month"
ExpiresByType text/plain                "access 2 days"
</IfModule>
# Gzip compression
<IfModule mod_deflate.c>
# Active compression
SetOutputFilter DEFLATE
# Force deflate for mangled headers
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
# Don’t compress images and other uncompressible content
SetEnvIfNoCase Request_URI \
\.(?:gif|jpe?g|png|rar|zip|exe|flv|mov|wma|mp3|avi|swf|mp?g|mp4|webm|webp|pdf)$ no-gzip dont-vary
</IfModule>
</IfModule>
# Compress all output labeled with one of the following MIME-types
<IfModule mod_filter.c>
AddOutputFilterByType DEFLATE application/atom+xml \
                              application/javascript \
                              application/json \
                              application/rss+xml \
                              application/vnd.ms-fontobject \
                              application/x-font-ttf \
                              application/xhtml+xml \
                              application/xml \
                              font/opentype \
                              image/svg+xml \
                              image/x-icon \
                              text/css \
                              text/html \
                              text/plain \
                              text/x-component \
                              text/xml
</IfModule>
<IfModule mod_headers.c>
Header append Vary: Accept-Encoding
</IfModule>
</IfModule>
# END WP Rocket
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress
# BEGIN WP Performance Score Booster Settings
# END WP Performance Score Booster Settings
 
 
 
 

  查看全部
最近做了下自己负责的项目的优化,小有收获,不敢独享特拿来分享。
一.最重要的一点莫过于图片的压缩。
图片压缩基本分三步走:1.手动用photoshop压缩,快捷键Ctrl+alt +shift+s,即是保存为web格式。图片可以选择png或者jpg格式,对于那种应该选择哪种格式,度娘那里都有介绍,我就不多赘述。一般质量80%就可以满足需求了。2.将保存的图片通过第三方压缩网站再次压缩https://tinypng.com/   最后下载的图片大小即可上传到网站后台。3.通过wordpress后台安装的插件EWWW img optimizer再次压缩。
二.WP rocket 插件的设置。
这里要根据不同网站,设置成不同的数值,因为如果随便文件都压缩的话,可能导致网站出现乱码情况,所以调整的时候要随时观察站点页面。总之一句话:能压缩的都压缩,最大化压缩网站文件。不废话直接上图:
1.png

2.png

3.png

4.png

5.png

6.png

注意对于preload选项的设置,我在Prefetch DNS Requests设置了相应的资源之后,移动端的评分高达98分,所以这个挺关键的。
三.WordPress 设置浏览器端缓存,加快访问速度.
在网站根目录(即是服务器public_html文件夹下面) .htaccess 文件中添加以下代码:
#Expire Header
ExpiresActive on //开启缓存
ExpiresByType text/css "access 1 month"//css文件缓存1个月
ExpiresByType text/plain "access 2 days"//纯文本内容缓存2天
ExpiresByType text/html "access 2 days"//html文件缓存2天
ExpiresByType application/javascript "access 1 month"//JS文件缓存1个月
ExpiresByType image/jpeg "access 1 month"//jpeg图片缓存1个月
ExpiresByType image/x-icon "access 1 month"//icon缓存1个月
ExpiresByType image/gif "access 1 month"//gif图片缓存一个月
ExpiresByType image/png "access 1 month"//png图片缓存一个月
ExpiresByType image/ico "access 1 month"//ico缓存1个月
ExpiresByType application/pdf "access 1 month"//pdf文件缓存一个月
ExpiresByType application/x-shockwave-flash "access 1 month"//flash缓存一个月
ExpiresDefault "access 1 month"// 默认(未提及的可缓存文件)缓存1个月
 
 
当然具体code干货代码,我也私下保存了一份(复制在.htaccess文件里面):

# BEGIN WP Rocket v3.1.4
# Use UTF-8 encoding for anything served text/plain or text/html
AddDefaultCharset UTF-8
# Force UTF-8 for a number of file formats
<IfModule mod_mime.c>
AddCharset UTF-8 .atom .css .js .json .rss .vtt .xml
</IfModule>
# FileETag None is not enough for every server.
<IfModule mod_headers.c>
Header unset ETag
</IfModule>
# Since we’re sending far-future expires, we don’t need ETags for static content.
# developer.yahoo.com/performance/rules.html#etags
FileETag None
<IfModule mod_alias.c>
<FilesMatch "\.(html|htm|rtf|rtx|txt|xsd|xsl|xml)$">
<IfModule mod_headers.c>
Header set X-Powered-By "WP Rocket/3.1.4"
Header unset Pragma
Header append Cache-Control "public"
Header unset Last-Modified
</IfModule>
</FilesMatch>
<FilesMatch "\.(css|htc|js|asf|asx|wax|wmv|wmx|avi|bmp|class|divx|doc|docx|eot|exe|gif|gz|gzip|ico|jpg|jpeg|jpe|json|mdb|mid|midi|mov|qt|mp3|m4a|mp4|m4v|mpeg|mpg|mpe|mpp|otf|odb|odc|odf|odg|odp|ods|odt|ogg|pdf|png|pot|pps|ppt|pptx|ra|ram|svg|svgz|swf|tar|tif|tiff|ttf|ttc|wav|wma|wri|xla|xls|xlsx|xlt|xlw|zip)$">
<IfModule mod_headers.c>
Header unset Pragma
Header append Cache-Control "public"
</IfModule>
</FilesMatch>
</IfModule>
# Expires headers (for better cache control)
<IfModule mod_expires.c>
ExpiresActive on
# Perhaps better to whitelist expires rules? Perhaps.
ExpiresDefault                          "access 1 month"
# cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
ExpiresByType text/cache-manifest       "access plus 0 seconds"
# Your document html
ExpiresByType text/html                 "access 2 days"
# Data
ExpiresByType text/xml                  "access plus 0 seconds"
ExpiresByType application/xml           "access plus 0 seconds"
ExpiresByType application/json          "access plus 0 seconds"
# Feed
ExpiresByType application/rss+xml       "access plus 1 hour"
ExpiresByType application/atom+xml      "access plus 1 hour"
# Favicon (cannot be renamed)
ExpiresByType image/x-icon              "access 1 month"
# Media: images, video, audio
ExpiresByType image/gif                 "access 1 month"
ExpiresByType image/png                 "access 1 month"
ExpiresByType image/jpeg                "access 1 month"
ExpiresByType video/ogg                 "access plus 1 month"
ExpiresByType audio/ogg                 "access plus 1 month"
ExpiresByType video/mp4                 "access plus 1 month"
ExpiresByType video/webm                "access plus 1 month"
ExpiresByType image/ico                 "access 1 month"
# HTC files  (css3pie)
ExpiresByType text/x-component          "access plus 1 month"

# Webfonts
ExpiresByType application/x-font-ttf    "access plus 1 month"
ExpiresByType font/opentype             "access plus 1 month"
ExpiresByType application/x-font-woff   "access plus 1 month"
ExpiresByType application/x-font-woff2  "access plus 1 month"
ExpiresByType image/svg+xml             "access plus 1 month"
ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
ExpiresByType application/pdf                 "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
# CSS and JavaScript
ExpiresByType text/css                  "access 1 month"
ExpiresByType application/javascript    "access 1 month"
ExpiresByType text/plain                "access 2 days"
</IfModule>
# Gzip compression
<IfModule mod_deflate.c>
# Active compression
SetOutputFilter DEFLATE
# Force deflate for mangled headers
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
# Don’t compress images and other uncompressible content
SetEnvIfNoCase Request_URI \
\.(?:gif|jpe?g|png|rar|zip|exe|flv|mov|wma|mp3|avi|swf|mp?g|mp4|webm|webp|pdf)$ no-gzip dont-vary
</IfModule>
</IfModule>
# Compress all output labeled with one of the following MIME-types
<IfModule mod_filter.c>
AddOutputFilterByType DEFLATE application/atom+xml \
                              application/javascript \
                              application/json \
                              application/rss+xml \
                              application/vnd.ms-fontobject \
                              application/x-font-ttf \
                              application/xhtml+xml \
                              application/xml \
                              font/opentype \
                              image/svg+xml \
                              image/x-icon \
                              text/css \
                              text/html \
                              text/plain \
                              text/x-component \
                              text/xml
</IfModule>
<IfModule mod_headers.c>
Header append Vary: Accept-Encoding
</IfModule>
</IfModule>
# END WP Rocket
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress
# BEGIN WP Performance Score Booster Settings
# END WP Performance Score Booster Settings
 
 
 
 

 

关于前面文章提到的slide revolution插件的responsive设置的最新发现

WordPressLeo 发表了文章 • 1 个评论 • 165 次浏览 • 2018-10-23 14:53 • 来自相关话题

这边可以对应几个不同设备屏幕的banner
一些插件的设置细节需要记录下来,这些平时很少用到的设置,不记录下来,下次又是要花时间去找

2.png

这边可以对应几个不同设备屏幕的banner
一些插件的设置细节需要记录下来,这些平时很少用到的设置,不记录下来,下次又是要花时间去找

建站的经验分享-新同事减少弯路*

WordPressLeo 发表了文章 • 3 个评论 • 199 次浏览 • 2018-10-23 14:29 • 来自相关话题

1、头部的菜单,要调用后台appearance中的menu,主题默认会有几个menu,




我这边是top menu,对应的调用代码为
<?php wp_nav_menu( array( 'theme_location' => 'top', 'menu_class' => 'nav-menu','container' => false,'items_wrap' => '%3$s' ) ); ?>
theme location 必须为top,具体为什么是top,可以看一下functions.php文件。
后续要有更多的menu,比如说底部有很多栏目,考虑用户友好性,我们最好也在functions.php当中新建几个menu,模仿前面已经有的menu来
2、头部做完,设计稿上面体现的就是接着一个banner,banner可以自己用swiper、bxslider等等插件做,但是我们一般是用一款slide revolution付费插件做的,只需要后台插入图片,然后简单可视化配置一下,短代码调用即可,至于为什么要用这个wordpress的插件,“用户友好性”,这是很重要的,下面很多地方我都会提到这个词,要便于客户使用,你要知道这个网站不是做给开发人员使用的。
3、banner做完,从设计稿上来看,一般而言,下面就是我们首页的主体内容了。下面讲一些小坑,主要就是元素的使用规范
(1)、按钮,因为一般是链接,所以不建议使用button、input这些,用了也还需要包一个a标签,所以直接使用a标签,按钮a标签建议display:inline-block; 内联块级元素,好处是我们可以定按钮的宽高,也可以定按钮的padding、margin等等,a标签默认是inline内联元素,是不能定宽高这些的。
(2)、我们建的站,一般来说,所有的标题都是需要有链接的,据我观察,新同事都会使用p标签,考虑多一点的会用个h1、h2...标签。我们要记住标题要有a标签,可以包在标题标签内,考虑到a标签在css上的特性,如果开始是用的p标签、h标签,那么后续这些p、h标签的样式都是没用的,还是要重写一遍给a标签,这种无用功完全可以避免。
(3)、所有可以点击的地方,必须要cursor: pointer,必须是这个手掌的图标,默认箭头的光标是不行的!
(4)、客户友好性,如何体现?简单说,就是后台要能设置,最初级的就是要让客户在后台直接设置、添加内容,而不是要跑到模板里添加(当然有些情况确实需要写到模板里,那也只能写模板,尽量和后台关联)。
            数据和后台关联,就需要用到字段插件,我们可以新建一些各种各样的字段,比如说图标字段、文本框字段,url字段等等,复杂点的有repeater字段,这个字段又可以包括几个其他的字段并关联起来,具体需要自己去研究,我们可以把前台需要的内容都写到对应的post、page当中去,这样客户只需要到对应的post、page当中添加前台需要的图片、文字等内容了。
            等做的多了,你就要考虑如何建字段更合适,不仅仅是客户可以设置,还要客户一眼就能明白这个字段是做什么的(因为我以前做字段的时候,经验不足,很多字段做好了,其实客户也不知道是干嘛用的)。
            如何把字段建好,可以参考一下那些付费主题的后台的文章编辑,付费主题一般这些做的比较好,当然要做到一样好,难度很大,毕竟付费主题会有很多其他的资源加载。
4、剩下最后一部分就是我们的底部菜单,前面也说到了,考虑到用户的友好性,最好也是调用menu,这样客户可以在menu当中添加菜单。
5、wordpress有个widgets我们要好好利用起来,共用的一些版块,我们可以写在widgets中,然后需要的地方调用一些即可,这样日后维护起来也是方便很多,不需要相同的版块改十来遍。默认functions.php文件也是提供了俩三个的wigets,需要新建可以模仿着新建几个。(这个也是相当推荐的,也就是做模板的时候多花个几分钟,不要建站的时候偷懒,到时维护起来就需要改十来个文件。)
6、另外对于一些问题,你要知道的是如何使用它,而不是花上半天想它为什么是这样的。
     为什么是这样这个问题留在你闲得无聊的时候再想。至于为什么这样,我只会告诉你,去问开源的人去,“为什么不按照你的想法来!”
7、之前提到做一些通用模板,我觉得这个想法ok。但其实吧,这个模板也是在心里的,做任何事情,你要有个大致的构想,就像写文章一样,你开头写什么、中间写什么,结尾写什么,心里要有点数,这样作文才能拿个基础分。建站也是一个道理,不能写到自己都乱了。(开始做这个的时候我也乱,可以说非常乱了,但第二个项目我就会有个大致的构想,当然了中间少不了各位老同事的帮助,那会问问题的次数,我是第二,没人第一了。)
     另外关于内容的调用,我们文件服务器上面有同事上传的很多很多的代码,都是能拿来用的,不会用,大家可以一起讨论。
 
 
 
一时间能想到的也不多,后续会持续更新...... 查看全部
1、头部的菜单,要调用后台appearance中的menu,主题默认会有几个menu,
1.png

我这边是top menu,对应的调用代码为
<?php wp_nav_menu( array( 'theme_location' => 'top', 'menu_class' => 'nav-menu','container' => false,'items_wrap' => '%3$s' ) ); ?>
theme location 必须为top,具体为什么是top,可以看一下functions.php文件。
后续要有更多的menu,比如说底部有很多栏目,考虑用户友好性,我们最好也在functions.php当中新建几个menu,模仿前面已经有的menu来
2、头部做完,设计稿上面体现的就是接着一个banner,banner可以自己用swiper、bxslider等等插件做,但是我们一般是用一款slide revolution付费插件做的,只需要后台插入图片,然后简单可视化配置一下,短代码调用即可,至于为什么要用这个wordpress的插件,“用户友好性”,这是很重要的,下面很多地方我都会提到这个词,要便于客户使用,你要知道这个网站不是做给开发人员使用的。
3、banner做完,从设计稿上来看,一般而言,下面就是我们首页的主体内容了。下面讲一些小坑,主要就是元素的使用规范
(1)、按钮,因为一般是链接,所以不建议使用button、input这些,用了也还需要包一个a标签,所以直接使用a标签,按钮a标签建议display:inline-block; 内联块级元素,好处是我们可以定按钮的宽高,也可以定按钮的padding、margin等等,a标签默认是inline内联元素,是不能定宽高这些的。
(2)、我们建的站,一般来说,所有的标题都是需要有链接的,据我观察,新同事都会使用p标签,考虑多一点的会用个h1、h2...标签。我们要记住标题要有a标签,可以包在标题标签内,考虑到a标签在css上的特性,如果开始是用的p标签、h标签,那么后续这些p、h标签的样式都是没用的,还是要重写一遍给a标签,这种无用功完全可以避免。
(3)、所有可以点击的地方,必须要cursor: pointer,必须是这个手掌的图标,默认箭头的光标是不行的!
(4)、客户友好性,如何体现?简单说,就是后台要能设置,最初级的就是要让客户在后台直接设置、添加内容,而不是要跑到模板里添加(当然有些情况确实需要写到模板里,那也只能写模板,尽量和后台关联)。
            数据和后台关联,就需要用到字段插件,我们可以新建一些各种各样的字段,比如说图标字段、文本框字段,url字段等等,复杂点的有repeater字段,这个字段又可以包括几个其他的字段并关联起来,具体需要自己去研究,我们可以把前台需要的内容都写到对应的post、page当中去,这样客户只需要到对应的post、page当中添加前台需要的图片、文字等内容了。
            等做的多了,你就要考虑如何建字段更合适,不仅仅是客户可以设置,还要客户一眼就能明白这个字段是做什么的(因为我以前做字段的时候,经验不足,很多字段做好了,其实客户也不知道是干嘛用的)。
            如何把字段建好,可以参考一下那些付费主题的后台的文章编辑,付费主题一般这些做的比较好,当然要做到一样好,难度很大,毕竟付费主题会有很多其他的资源加载。
4、剩下最后一部分就是我们的底部菜单,前面也说到了,考虑到用户的友好性,最好也是调用menu,这样客户可以在menu当中添加菜单。
5、wordpress有个widgets我们要好好利用起来,共用的一些版块,我们可以写在widgets中,然后需要的地方调用一些即可,这样日后维护起来也是方便很多,不需要相同的版块改十来遍。默认functions.php文件也是提供了俩三个的wigets,需要新建可以模仿着新建几个。(这个也是相当推荐的,也就是做模板的时候多花个几分钟,不要建站的时候偷懒,到时维护起来就需要改十来个文件。)
6、另外对于一些问题,你要知道的是如何使用它,而不是花上半天想它为什么是这样的。
     为什么是这样这个问题留在你闲得无聊的时候再想。至于为什么这样,我只会告诉你,去问开源的人去,“为什么不按照你的想法来!”
7、之前提到做一些通用模板,我觉得这个想法ok。但其实吧,这个模板也是在心里的,做任何事情,你要有个大致的构想,就像写文章一样,你开头写什么、中间写什么,结尾写什么,心里要有点数,这样作文才能拿个基础分。建站也是一个道理,不能写到自己都乱了。(开始做这个的时候我也乱,可以说非常乱了,但第二个项目我就会有个大致的构想,当然了中间少不了各位老同事的帮助,那会问问题的次数,我是第二,没人第一了。)
     另外关于内容的调用,我们文件服务器上面有同事上传的很多很多的代码,都是能拿来用的,不会用,大家可以一起讨论。
 
 
 
一时间能想到的也不多,后续会持续更新......

关于slide revolution 怎么做到移动端更好的效果

WordPressEastern_Design_Studio 回复了问题 • 2 人关注 • 2 个回复 • 273 次浏览 • 2018-10-22 16:45 • 来自相关话题