@aamodtgroup/agtech 中文文档教程
AG Tech - Frontity theme
Frontity 的入门主题，支持常见的 Gutenberg WordPress 编辑器块、暗模式和从 wordpress 获取菜单。
Table of contents
Quick install
这个主题需要一个在 Wordpress Rest API 中显示菜单的插件，我们推荐这个插件： WP-REST-API V2 Menus
安装插件后，创建一个名为“菜单”，一切顺利。
使用 AG Tech - Frontity 主题 创建一个名为
agtech-project的 Frontity 项目
npx frontity create --theme @aamodtgroup/agtech agtech-project
- The CLI will run its part and once completed, cd to the project
cd agtech-project
- Open your code editor and edit the url in frontity.settings.js so that it points to your wordpress install
{
name: "@frontity/wp-source",
state: {
source: {
url: "https://wpurl.com/",
}
}
}
- Run the project and have fun! :tada:
npx frontity dev
Gutenberg
默认情况下，这些主题包括 Gutenberg 块的所有默认样式，这些样式取自
wp-includes\css\dist\block-library\style.css
wp-includes\css\dist\block-library\theme.css
此外我们还有在页面和帖子模板中包含某些特定于主题的样式。
为了向您的古腾堡块添加自定义样式，您首先需要将块添加到“组”块中并为其分配一个 CSS 类。 因此，您可以使用此 CSS 类来设置整个块以及组块内所有子块的样式。
Bootstrap
我们包含了一个最低限度的 bootstrap css，它结合了以下 Bootstrap css/scss 文件：函数、变量、mixins、root、reboot 、类型、网格、表单和实用程序。
这基本上为通用布局/网格和响应式断点提供了基础。
不包含 bootstrap JS
Credits
AG Tech - Frontity theme
A starter theme for Frontity with support for common Gutenberg WordPress editor blocks, darkmode and fetching menus from wordpress.
Table of contents
Quick install
This theme requires a plugins that shows menus in the Wordpress Rest API, we recommend this plugin: WP-REST-API V2 Menus
After you have installed the plugin, create a menu called "Menu", and you are good to go.
Create a Frontity project named
agtech-projectwith AG Tech - Frontity theme
npx frontity create --theme @aamodtgroup/agtech agtech-project
- The CLI will run its part and once completed, cd to the project
cd agtech-project
- Open your code editor and edit the url in frontity.settings.js so that it points to your wordpress install
{
name: "@frontity/wp-source",
state: {
source: {
url: "https://wpurl.com/",
}
}
}
- Run the project and have fun! :tada:
npx frontity dev
Gutenberg
By default, these theme includes all the default styles of Gutenberg blocks, which is taken from
wp-includes\css\dist\block-library\style.css
wp-includes\css\dist\block-library\theme.css
In addition we have included certain theme specific styles to the page and post templates.
In order to add custom styles to your Gutenberg blocks you first need to add the blocks inside a "Group" block and assign a CSS class(es) to it. Thus you could use this CSS class(es) to style the entire block along with all sub blocks inside the group block.
Bootstrap
We have included a bare-minimum bootstrap css which combines following Bootstrap css/scss files: functions, variables, mixins, root, reboot, type, grid, forms and utilities.
This essentially provides a base to common layout/grid and responsive breakpoints.
No bootstrap JS included
