如何在一行中显示倒计时文本和数字

此 倒计时器元素 是 GemPages 中最受欢迎的元素之一，可用于在 Shopify 着陆页、产品页和促销活动中营造紧迫感并提高转化率。

默认情况下，当您将倒计时器元素拖放到页面中时，数字和文本会显示在两行中：

• 数字显示在顶部
• 文本标签显示在下方。

在某些情况下，您可能希望文本和数字显示在同一行中，尤其是在布局更简洁、公告栏或紧凑的促销部分中。

本文将向您展示如何使用 GemPages 中的自定义代码在一行中显示倒计时文本和数字。

关于 GemPages 中的倒计时计时器元素

此 倒计时器元素 GemPages 帮助商家创建有时效性的营销活动，以增强紧迫感并鼓励客户更快地采取行动。

您可以将其用于：

• Flash销售
• 产品发布会
• 限时优惠
• 节日活动
• 预购促销

如何在一行中显示文本和数字

步骤 1：打开自定义代码编辑器

在 GemPages 编辑器中：

• 选择倒计时计时器元素
• 右键单击该元素
• 选择 自定义代码

这样，您就可以专门为该元素添加自定义 CSS，而不会影响页面的其余部分。

步骤 2：添加自定义 CSS 代码

将以下代码粘贴到“自定义代码”部分：

classID div#section-countdown > div{

显示：flex;

align-items：居中;

间隙：5px；

}

步骤 3：替换 classID

保存前，请务必替换为：

classID

使用倒计时计时器元素的实际类 ID。

步骤 4：保存并发布。

应用代码后，倒计时数字和文本标签将显示在一行水平线上，而不是垂直堆叠。