Microthemer CSS编辑器插件如何改变您的开发

尝试使用CSS和网站设计总是有趣.但是,如果您想快速实施或测试某些东西,请用颜色这就是为什么存在像微素存在的插件.

Microthemer是一个Visual CSS编辑器插件,允许您查看在您的网站时所做的任何更改.其直观的界面将CSS代码带到前端,所以你所要做的就是用鼠标左右移动页面元素.

Microthemer允许您可视化任何CSS更改,并使您更容易修改您的网站的外观在点击按钮中.但尽可能简单,此插件不仅适用于WordPress初学者或患有代码编辑恐惧症的人.具有定制设计包和集成代码编辑器等功能,微观测量使初学者和优点更容易.

继续读取,或使用以下链接跳转:

  • 使用设计包更改您的网站或插件主题
  • 重新设计按钮(或其他任何东西!)单击
  • 加剧你的字体
  • 使用集成的代码编辑器添加自定义代码
  • 恢复更改

使用设计包更改您的网站或插件主题

微量测量器允许您通过使用设计包完全转换您的网站的风格.

Microthemer的设计包包含其他用户先前使用Microthemer创建的文件夹,选择器,手工编码CSS和背景图像.它们分为两种类型:皮肤和支架.

皮肤

皮肤更改主题或插件的外观.Microthemer提供主题皮肤和插件Skins -前者改变了网站的主题的外观,而后者允许您修改插件.有几种Skins可用于POLDENT FORM 7.PLUS,Microthemer在其支持中心进口或导出自己的设计包装有一点漂亮的教程.

一旦通过设计包下载了皮肤,您可以覆盖现有风格或将皮肤合并到现有设置.

微刻器导入设计包.

效果通常是优选的,因为它的破坏性较小.Microthemer只是将设计包中的文件夹,选择器和自定义代码附加到现有设置.覆盖将替换所有以前应用的样式.

支架

脚手架不会改变任何东西的外观.根据Microthemer知识库,脚手架的目的是"脚手架你自己的设计过程".

微扫描器脚手架包含若干选择特定主题或插件的HTML元素的选择器,但它们不包含任何新的样式规则.这意味着您可以输入自己的样式.与皮肤一样,您可以拥有主题脚手架和插件脚手架.

您可以将脚手架输出到设计包中,同样可以导出皮肤.要直接从Microthemer导出现有设计包,您所要做的就是从包菜单中选择导出选项-这将导出要导出到设计包脚手架的任何文件夹,选择器或手工编码的CSS.

脚手架通过简化设计过程来帮助.考虑到大多数微刻的脚手架是由经验丰富的CSS大师制造的,它们是简化您的设计过程的重要方法.

重新设计按钮(或其他任何其他内容!),单击

我有一点痴迷与精心设计的按钮.我的意思是,什么是不喜欢的?一个很好的交互式按钮使用户体验无限更好.而且你当然可以在微米镜中做到这一点.

Microthemer Works的方式通过修改CSS选择器.您可以将标签附加到选项器中,使其更轻松地检索和自定义.

所以,如果要修改页面上的特定按钮,可以执行以下操作:

下载并激活插件后,访问MicroPremer工作区.通过双击元素或单击目标图标,选择要重新设计的按钮.我选择在我的网站上修改此CTA按钮:

microthemer button

在修改任何内容之前,您必须创建选择器.输入您的选择器名称,选择要在下面执行的选择器创建选择器的文件夹,然后单击"创建选择器".

一旦创建了选择器,您可以更改您喜欢的任何内容!例如,您可以更改按钮的字体:

更改按钮字体.

或您的按钮颜色:

更改按钮颜色.

或尺寸!

更改按钮大小.

通过定位单独的元素,您可以在网站上快速自定义任何内容,而不会摆弄单个代码.所以您不仅可以自定义按钮,还可以更改单个元素和碎片,并将它们转换为您想要的任何内容.

并且当然会让生活更容易.

加上您的字体

好的,所以辣味是我们如何将谷歌字体分类-他们可能会在更多的实际类别下跌落.但是,一个良好的字体对任何网站都有很大的不同.在您进入网站的实际文本之前,字体首先与您通信.

Microthemer允许您轻松添加Google字体的网站而无需任何大惊小怪.您所要做的就是为要创建的元素创建一个选择器,并应用您选择的Google字体.

创建了文本选择器(i调用此"部分标题测试"),从下拉列表中选择 google字体...选项.然后选择任何谷歌字​​体袭击你的花哨和presto!

选择google字体.

您的部分标题的新谷歌字体-只需点击几下.

如果您对代码微量模拟器生成的好奇,您可以通过生成的css&js 下的视图菜单选项访问它.在这种情况下,字体更改在此处显示:

Microthemer Generate CSS

您还可以通过微米器代码编辑器手动更改字体,这是我们将覆盖的内容.

使用集成的代码编辑器添加自定义代码

如果您对您的代码非常特别,请不要担心-微米器有您的背部.

可以从视图菜单选项中切换代码编辑器,该选项选项显示顶部的代码编辑器.

因此,如果我想手动更改相同标题部分的字体,就像我们在上一个示例中所做的那样,您必须要做的就是创建一个带有该部分目标的选择器.单击"创建选择器"按钮时自动生成此代码:

Microthemer code editor 微训练器代码编辑器.

并手动输入自定义字体更改.

例如,如果我决定将字体更改为ARIAL,则刚刚在Microthemer编辑器中弹出以下代码:

和这里我们走了:

Microthemer Code Editor data-true

恢复更改

如果您是一个经验丰富的WordPress开发人员(或任何类型的开发人员,真的),您知道备份是键.没有什么比下沉的感觉更糟糕的是,在做出可怕的错误后,你无法恢复到以前的修改.幸运的是,微米器在这里让它变得更好.

Microthemer允许您快速而轻松地将任何以前的设置恢复到它们的方式.所以你不必手动进入并不断地摆脱你的代码.没有较大的时间吮吸而不是用代码摆弄.

Microthemer允许您恢复所有更改或恢复到以前的修订.要查看修订历史记录,您所要做的就是选择修订图标.您可以查看修订历史记录并恢复到特定的时间点:

Microthemer backups micropremer备份.

...或选择另一个还原选项,如清晰的样式重置所有.重置所有内容后,您的所有设置将恢复到原始状态.

包装

视觉CSS编辑器,如微量模拟器不是革命性的概念.但是,完成后,像微素一样的有效插件可以成为任何WordPress开发人员的资产.如果您经常按下时间,请在单击按钮中进行更改始终是一种吸引人的概念.

当然,如果您有技能,您可以始终自行重新全新的网站的CSS.但是很高兴知道还有其他选项意味着让你的生活更轻松吗?

8
订阅评论
提醒
0 评论
内联反馈
查看所有评论