GeneratePress 和 Easy Digital Downloads 同时使用时，GeneratePress 实际上并没有针对 Easy Digital Downloads 优化的任何样式。
简单来说，GeneratePress 专注于 WooCommerce，因为它比 Easy Digital Downloads 的安装量大得多，如下所示。截至撰写本文时，WooCommerce 的安装量已超过 500 万，而 Easy Digital Downloads 的安装量则少了很多。
以下是未应用任何 GeneratePress 样式时 Easy Digital Downloads 的外观。
即使应用了 Easy Digital Downloads 的样式，效果也依然很糟糕。说它难看，简直是轻描淡写了。
为 EDD 添加样式真是一项苦差事，但我提供了一些基础的 SASS 文件，欢迎你随意修改。
- 结账表单
- 登录表单
- 许可证页面
- 历史页面
- 更新付款表单
以下是应用 GeneratePress 样式后结账页面的外观：
当然，您需要禁用 EDD 样式，以防止样式冲突。
您需要在外观自定义程序中为“附加 CSS”启用 SCSS 处理器。
这就是功能强大的 SASS 代码。它并不完美，但应该能为你提供一个不错的起点。
/* Define Base Colors */
$mr_link_color: #17a2b8;
$mr_orange: #ed8e00;
$mr_dark_blue: #0693e3;
$mr_light_blue: #0583ca;
$mr_light_gray: #EFF2F5;
$mr_white: #FFFFFF;
$mr_black: #000000;
$mr_red: #FF0000;
#edd_checkout_wrap {
/* Style the cart table on the checkout page */
#edd_checkout_cart {
thead tr {
background-color: $mr_light_blue;
color: $mr_white;
}
tbody tr {
background-color: $mr_light_gray;
}
tfoot {
background-color: $mr_light_blue;
color: #FFF;
.edd_cart_footer_row th {
text-align: center;
}
}
}
/* Style the renew license section */
fieldset#edd_sl_renewal_fields {
background-color: $mr_light_gray;
padding: 30px 20px;
}
/* Add some margin to the credit cards */
.edd-payment-icons {
margin: 20px 0;
img {
margin-right: 10px;
}
}
/* Hide the discount code if you like */
#edd_discount_code {
display: none;
}
/* Turn the radio payment methods into divs */
#edd_payment_mode_select {
legend {
font-weight: 700;
letter-spacing: 2px;
}
}
#edd-payment-mode-wrap label {
display: block;
margin-bottom: 15px;
input {
margin-right: 15px;
}
}
/* Fix the form alignments */
#edd_purchase_form_wrap {
legend {
width: 100%;
display: block;
font-size: 22px;
font-weight: 700;
border-bottom: 1px solid $mr_black;
}
.edd-label {
font-weight: 700;
display: block;
}
.edd-required-indicator {
color: $mr_red;
}
.edd-description {
display: block;
padding: 20px 0;
}
.edd-input {
display: block;
width: 100%;
text-transform: none;
font-size: 18px;
}
#edd_secure_site_wrapper {
display: flex;
background: $mr_light_blue;
padding: 20px 10px;
margin-bottom: 20px;
color: #FFF;
align-items: center;
.padlock svg {
fill: #FFF;
margin-left: 15px;
margin-right: 15px;
}
}
}
/* Purchase Total */
#edd_final_total_wrap {
font-size: 18px;
text-align: left;
letter-spacing: 2px;
}
/* Purchase button */
input#edd-purchase-button {
border-radius: 2px;
font-size: 22px;
text-transform: none;
display: block;
width: 100%;
}
}
/* Update Payment Screen */
#edd_checkout_form_wrap {
label {
display: block;
margin-bottom: 15px;
input {
margin-right: 15px;
}
}
/* Fix the form alignments */
legend {
width: 100%;
display: block;
font-size: 22px;
font-weight: 700;
border-bottom: 1px solid $mr_black;
}
.edd-label {
font-weight: 700;
display: block;
}
.edd-required-indicator {
color: $mr_red;
}
.edd-description {
display: block;
padding: 20px 0;
}
.edd-input {
display: block;
width: 100%;
text-transform: none;
font-size: 18px;
}
}
/* Purchase History Page */
.edd-purchase-history {
#edd_user_history,
#edd_sl_license_keys {
thead tr {
font-size: 18px;
background-color: $mr_light_blue;
color: $mr_white;
}
tbody {
font-size: 14px;
}
tbody tr:nth-child(even) {
background-color: $mr_light_gray;
}
}
}
/* Purchase Confirmation page */
body.edd-success {
#edd_purchase_receipt,
#edd_subscription_receipt,
#edd_purchase_receipt_products {
thead tr,
.edd_license_keys {
background-color: $mr_light_blue;
color: $mr_white;
}
.edd_license_key {
font-size: 16px;
background: $mr_light_gray;
td:first-child {
font-weight: 700;
}
}
}
#edd_purchase_receipt_products {
.edd_purchase_receipt_product_name {
font-weight: 700;
}
.edd_purchase_receipt_files {
list-style-type: none;
margin: 0;
margin-top: 20px;
padding: 0;
.edd_bundled_product_name {
display: block;
background: $mr_light_gray;
color: $mr_black;
padding: 10px 20px;
font-weight: 700;
}
.edd_bundled_product_files {
list-style-type: none;
margin: 20px 40px;
}
}
}
}
/* License Page */
.edd-purchase-history {
.edd-sl-manage-license-header {
font-size: 1.5em;
}
.edd-sl-manage-license-key {
font-weight: 700;
}
.edd-sl-manage-license-product {
font-weight: 700;
span {
font-weight: 400;
}
}
#edd_sl_license_sites {
thead tr {
font-size: 18px;
background-color: $mr_light_blue;
color: $mr_white;
}
tbody {
font-size: 14px;
}
tbody tr:nth-child(even) {
background-color: $mr_light_gray;
}
}
#edd_sl_license_add_site_form {
.edd-input {
display: block;
width: 100%;
margin-bottom: 20px;
}
}
}
/* EDD Login Form */
#edd_login_form {
fieldset legend {
font-weight: 700;
}
.edd-login-username,
.edd-login-password {
label {
display: block;
font-weight: 700;
margin-bottom: 10px;
}
input {
display: block;
width: 100%;
}
}
}
