Elementor nav menu dropdown align center

Elementor menu widget 下拉选单,预设靠左对齐,我找不到选项去调整子选单的对齐方式,想说用 CSS 下 text-align:center 就好,结果不是,Elementor子选单内的 a 标签是用 flex 去对齐的,所以要用 flex 的方式去对齐

flex 内容置中

在这边会透过下列 CSS 达成水平置中

如果要靠左,可以换成下列 CSS

Step 1

下方 CSS 贴到主题的 style.css 文件,或贴到 menu widget 进阶选项的自订样式栏位中,我自己是习惯写在 style.css 以免时间一久自己写在[……]

Read more

Elementor form 停用 Ajax ,Js 自订发送动作

Elementor 的 form widget 实在好用,透过所见及所得的方式就可以拉出精美表单,虽然Elementor 已经很贴心地整合很多表单发送后的动作,但还是有些情况并不一定适用,比如说在官网的表单其实是要发送至另一个系统,这些预设程序就无法处理,虽然 Elementor 有提供 API 可以去扩充这些程序,但这些处理程序是表单透过 Ajax 方式发送至后端处理,这种情况,除非目标的系统也开出对应的API端口,就可以顺利衔接,但有些时候目标系统并不是我们能控制的,仅能透过传统的 Http post 方式传递表单资料到目标系统,但 Elementor 目前没有开启或关闭 Ajax 的选项[……]

Read more

Elementor Widget Posts Pagination Link causing “too many redirect” Error

问题描述

目前使用 Elementor Pro 3.1.0

WordPress 使用 Elementor 编辑器编辑页面,于页面中插入“文章”这个小工具并开启页码选项,小工具产生的页码连结,于预览时连结正常,但于发布的网页,点击会造成浏览器 ERR_TOO_MANY_REDIRECTS 错误,以致不能造访第二页之后的页面

新增 Elementor Posts Widget

开启页码选项

在 Elementor 预览的模式中是正常的,在分类的模板中也是正常可运行的,而在页面中产生分类列表分页连结就有这问题,我不确定是不是Bug,Posts Widget[……]

Read more

Elementor sticky footer

无法接受内容少的时候,或萤幕解析度较大的时候 Footer 浮在半空中,这会让我很难过,以前切HTML就有这种症状,在WordPress中也是一样,无法接受,所以花了一些时间找到一个最简单的解决方法

以下几行CSS就可以搞定

https://stackoverflow.com/a/59071640
https://css-tricks.com/couple-takes-sticky-footer/#article-header-id-3
https://stackoverflow.com/q/1488565

[……]

Read more

WooCommerce JavaScript/jQuery events 懒人包

WooCommerce 为让介面友善频繁使用 javascript / jQuery 透过 Ajax 异步更新“动态资料”或“版面区块”,对于开发者而言,也必须处理前端的异步更新后的资料,通常会借由event 去触发特定程式,bagerathan 贴心的整理出 WooCommerce 商品页 ( product page )、购物车页 ( cart page )、结帐页 ( checkout page ) 常用 js 事件( event )对照表,方便开发者速查

https://gist.github.com/bagerathan/2b57e7413bfdd09afa04c7be[……]

Read more

WordPress customize site title in theme

大部分看到都是用 wp_title 这个 filter 去改,但对于我 wp_title 不起作用,我找到资料提到自 Wordpress v4.4.0 起,标题的生成方式已更改。这也许是我用 wp_title 仍无法修改的主因

最简单的用法

以下范例是最简单的做法,将下列代码置主题根目录下的 functions.php

加入一些判断

更多判断

虽然 wp_title 对我不起作用,但官网文件仍然有价值,可以参考其判断方式,这边做了一点点的修改,一样可以套用 wp_title 的处理方法
https://developer.wordpress.org/refe[……]

Read more

WordPress theme not showing site title in head

如果您开发的主题,没有出现标题,需要检查一下当前主题是否包含:

如果主题中找不到,请在主题根目录加入它,必须要在 after_setup_theme 这个 Hook 中,实际范例如下

https://wordpress.stackexchange.com/a/296877/116304

https://developer.wordpress.org/reference/functions/wp_title/

[……]

Read more

elementor action after form submit

虽然 elementor 有很丰富的表单发送后的处理动作,针对特别情况,例如我们希望把表单资料转存至自家的CRM保存,这时就要自订义表单发送后的处理动作了,以下官方文件中自订义表单发送后的动作

https://developers.elementor.com/forms-api/#Form_New_Record_Action

[……]

Read more

WordPress blank theme and starter theme for Developers

对于开发人员,开始一个WordPress专案,依属性的不同,开发方式会区分为“全客制”或“半客制”开发,各有优缺点,而依据开发方式的不同,开发人员必须选择适当主题最为基础来开始制作专案,而哪种主题适合呢?

“空白主题 blank theme”适用于全客制开发

用此种开发方式,基本上这个专案具有独特性,非“常态性”网站,比较难用通用的样式或版面结构去套用,自干型网站,这种情况就适合使用空白主题 (blank theme),直接以空白主题开发,未来也需要自行维护这个主题

空白主题最大特色就是什么都没有,但也并非什么都没有,更正确的说法应该是干净的主题,预先建立主题档案结构及初始程[……]

Read more

WordPress Elementor RWD CSS breakpoint

WordPress Elementor 提供3种装置分别是电脑、平板、手机,虽然可以用 CSS @media 比较标准的方式来判断,但在 Elementor 中断点的尺寸是一个参数,可以自订义数值,此状况若透过客制 CSS,以 @media 这种方式给予响应式的样式,因为断点可能会跟Elementor 编辑器产生的内容样式有差异,除非每改一次断点宽度,都需要再调整过所有的 CSS @media 断点数值,或禁止主题去调整断点宽度数值,但这主题将对 Elementor 不友善,与主题开发以最大化的开发原则背道而驰

Elementor 可以透果 body 上的 data-elementor-[……]

Read more