{"id":7192,"date":"2025-01-30T13:51:43","date_gmt":"2025-01-30T21:51:43","guid":{"rendered":"https:\/\/hawaiipublicschools.org\/internal\/design-modules\/"},"modified":"2025-02-10T09:57:34","modified_gmt":"2025-02-10T19:57:34","slug":"design-modules","status":"publish","type":"page","link":"https:\/\/hawaiipublicschools.org\/vi\/internal\/design-modules\/","title":{"rendered":"Design Modules"},"content":{"rendered":"
\n
\n

Create Custom Buttons<\/h3>\n\n\n\n

Custom designed buttons were created to use thoughout the site. The button text and link can be updated accordingly. In addition, use these buttons sparingly\u2014when calling special attention to a link. Featuring too many buttons on a page will result in a cluttered page. For all other links, use a basic hotlink (Hotlinks have a underline<\/a>).<\/p>\n\n\n\n

For all light-color background pages, use the button with a black border, <\/strong>as shown below.
How to: Select the pattern called \u201cButton – Border Box Pos\u201d<\/strong><\/mark><\/em><\/p>\n\n\n\n

\n
T\u00ecm hi\u1ec3u th\u00eam<\/a><\/div>\n<\/div>\n\n\n
\n\n
\n
\n
T\u00ecm hi\u1ec3u th\u00eam<\/a><\/div>\n<\/div>\n<\/div><\/div>\n\n\n\n
\n

C\u00e1i n\u00e0y button with a white border<\/strong> was designed for dark color backgrounds.
How to: Select the pattern called <\/mark><\/em>“Button – Border Box Neg”<\/em> <\/mark><\/strong><\/p>\n<\/div><\/div>\n\n<\/div><\/div>\n\n\n

<\/div><\/div>\n\n\n\n

How to: Select the pattern called \u201cDivider with Kapa pattern\u201d<\/strong><\/em><\/p>\n\n\n\n

<\/div>\n\n\n\n

Using custom blocks<\/h2>\n\n\n\n

Create Accordion Menus<\/h3>\n\n\n\n

The accordion menu is ideal for organizing content like C\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p<\/strong>. Use this custom block to enable a user to easily digest large amounts of information efficiently<\/strong>. Consider that the user must click on a \u201cmenu item\u201d to reveal the content.<\/p>\n\n\n\n

Menu item text goes here<\/summary>\n

Text will be revealed here upon clicking arrow<\/p>\n<\/details>\n\n\n\n

Menu item text goes here<\/summary>\n

Text will be revealed here upon clicking arrow<\/p>\n<\/details>\n\n\n\n

Menu item text goes here<\/summary>\n

Text will be revealed here upon clicking arrow<\/p>\n<\/details>\n\n\n\n

How to: Select the block called \u201cDetails\u201d<\/strong><\/em><\/p>\n<\/div>\n\n\n\n

\n\n
\n
\"Close<\/figure>\n<\/div><\/div>\n\n\n\n
\n
\u0110\u1ec2 BI\u1ebeT TH\u00caM TH\u00d4NG TIN<\/h5>\n\n\n\n

Use this side box when creating a NEW side box on a page. Use this to call attention to important information relevant to the content of the page. Copy should be short and succinct.<\/p>\n<\/div><\/div>\n\n<\/div><\/div>\n\n\n

How to: Select the block called \u201cSide box for flex content\u201d<\/strong><\/em><\/p>\n\n\n\n

<\/div>\n\n\n
\n\n
\n
\"\"<\/figure>\n<\/div><\/div>\n\n\n\n
\n
y\u00eau c\u1ea7u d\u1eef li\u1ec7u & th\u1eafc m\u1eafc<\/h5>\n\n\n\n

Chi nh\u00e1nh qu\u1ea3n l\u00fd v\u00e0 ph\u00e2n t\u00edch d\u1eef li\u1ec7u (DGA)<\/strong>
\u0110i\u1ec7n tho\u1ea1i: 808-784-6061
E-mail<\/a><\/p>\n<\/div><\/div>\n\n<\/div><\/div>\n\n\n

How to: Select the block called \u201cSide box – Data Requests\u201d<\/strong><\/em><\/p>\n\n\n\n

<\/div>\n\n\n
\n\n
\n
\"\"<\/figure>\n<\/div><\/div>\n\n\n\n
\n
t\u1ea1o ra s\u1ef1 kh\u00e1c bi\u1ec7t th\u1ef1c s\u1ef1<\/h5>\n\n\n\n

Truy\u1ec1n c\u1ea3m h\u1ee9ng v\u00e0 thu h\u00fat tr\u00ed \u00f3c tr\u1ebb th\u01a1 v\u1edbi t\u01b0 c\u00e1ch l\u00e0 gi\u00e1o vi\u00ean c\u1ee7a S\u1edf Gi\u00e1o d\u1ee5c Ti\u1ec3u bang Hawai'i. T\u00ecm hi\u1ec3u th\u00eam v\u1ec1 c\u00e1c c\u01a1 h\u1ed9i gi\u1ea3ng d\u1ea1y th\u00fa v\u1ecb tr\u00ean t\u1ea5t c\u1ea3 c\u00e1c \u0111\u1ea3o khi l\u00e0m vi\u1ec7c v\u1edbi h\u1ecdc sinh m\u1eabu gi\u00e1o, ti\u1ec3u h\u1ecdc, trung h\u1ecdc c\u01a1 s\u1edf v\u00e0 trung h\u1ecdc ph\u1ed5 th\u00f4ng.<\/p>\n\n\n\n

\n
T\u00ecm vi\u1ec7c l\u00e0m<\/a><\/div>\n<\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n\n

How to: Select the block called \u201cSide box – Make a difference\u201d<\/strong><\/em><\/p>\n<\/div>\n<\/div>\n\n\n\n

<\/p>","protected":false},"excerpt":{"rendered":"

Create Custom Buttons Custom designed buttons were created to use thoughout the site. The button text and link can be updated accordingly. In addition, use these buttons sparingly\u2014when calling special attention to a link. Featuring too many buttons on a page will result in a cluttered page. For all other links, use a basic hotlink […]<\/p>","protected":false},"author":5,"featured_media":0,"parent":7181,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_relevanssi_hide_post":"","_relevanssi_hide_content":"","_relevanssi_pin_for_all":"","_relevanssi_pin_keywords":"","_relevanssi_unpin_keywords":"","_relevanssi_related_keywords":"","_relevanssi_related_include_ids":"","_relevanssi_related_exclude_ids":"","_relevanssi_related_no_append":"","_relevanssi_related_not_related":"","_relevanssi_related_posts":"","_relevanssi_noindex_reason":"","_sitemap_exclude":false,"_sitemap_priority":"","_sitemap_frequency":"","_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","wp_popup_display_lightbox":0,"wp_popup_suppress":"","wp_popup_trigger":"","wp_popup_trigger_amount":0,"wp_popup_disable_on_mobile":false,"footnotes":""},"class_list":["post-7192","page","type-page","status-publish","hentry"],"pp_statuses_selecting_workflow":false,"pp_workflow_action":"current","pp_status_selection":"publish","taxonomy_info":[],"featured_image_src_large":false,"author_info":{"display_name":"Steven Tu","author_link":"https:\/\/hawaiipublicschools.org\/vi\/author\/stevenstaceyleong-com\/"},"comment_info":0,"publishpress_future_action":{"enabled":false,"date":"2026-04-11 09:32:30","action":"change-status","newStatus":"draft","terms":[],"taxonomy":"","extraData":[]},"publishpress_future_workflow_manual_trigger":{"enabledWorkflows":[]},"_links":{"self":[{"href":"https:\/\/hawaiipublicschools.org\/vi\/wp-json\/wp\/v2\/pages\/7192","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hawaiipublicschools.org\/vi\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hawaiipublicschools.org\/vi\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hawaiipublicschools.org\/vi\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/hawaiipublicschools.org\/vi\/wp-json\/wp\/v2\/comments?post=7192"}],"version-history":[{"count":0,"href":"https:\/\/hawaiipublicschools.org\/vi\/wp-json\/wp\/v2\/pages\/7192\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/hawaiipublicschools.org\/vi\/wp-json\/wp\/v2\/pages\/7181"}],"wp:attachment":[{"href":"https:\/\/hawaiipublicschools.org\/vi\/wp-json\/wp\/v2\/media?parent=7192"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}