Problem/Motivation

Varbase Starter ships the global Header region with site branding and the main menu only. A fresh Varbase Starter site therefore has no way to search from the header, even though the site template already installs the search view (views.view.search, path /search) through Drupal CMS Search. The approved Varbase header design has a search icon at the end of the header that opens a search bar.

Steps to reproduce

  1. Install Varbase 11 with the Varbase Starter site template.
  2. Look at the header on any page.

Result: no search control anywhere in the header.

Proposed resolution

  • In config/canvas.page_region.vartheme_bs5.header.yml, place the Icon Toggle (with the new "Inline bar" panel style) at the end of the header group, after the main menu, and put the "Exposed form: search-page" block in its content slot. Add both new config dependencies.
  • Ship the two component configs the region now depends on: config/canvas.component.sdc.vartheme_bs5.icon-toggle.yml and config/canvas.component.block.views_exposed_filter_block.search-page.yml.
  • In recipe.yml, add a config action setting the search view's exposed placeholder to the design's wording ("Search by keyword") instead of Drupal CMS Search's default "Enter search keywords". Doing it as a recipe action avoids patching the third-party Drupal CMS Search recipe.

Depends on the Vartheme BS5 issue "Style the Search in the Header" (#3593698) — the Icon Toggle "Inline bar" panel style — being merged and released first, because the stored component version hash comes from the new component definition.

AI-Generated: Yes

Remaining tasks

  • ✅ File an issue
  • ➖ Addition/Change/Update/Fix
  • ➖ Testing to ensure no regression
  • ➖ Automated unit testing coverage
  • ➖ Automated functional testing coverage
  • ➖ UX/UI designer responsibilities
  • ➖ Readability
  • ➖ Accessibility
  • ➖ Performance
  • ➖ Security
  • ➖ Developer Documentation
  • ➖ User Guide Documentation
  • ➖ Reviewed by human
  • ➖ Code review by maintainers
  • ➖ Full testing and approval
  • ➖ Credit contributors
  • ➖ Review with the product owner
  • ➖ Release notes snippet
  • ✅ Release varbase_starter-1.0.0-rc1

User interface changes

  • The header gains a search icon that opens a search bar; the search field placeholder reads "Search by keyword".

API changes

  • No.

Data model changes

  • No. Config only (one updated page region, two new component configs, one recipe config action).

Release notes snippet

  • The Varbase Starter header now ships a search box: a search icon at the end of the header opens a search bar wired to the site search page.
Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

rajab natshah created an issue. See original summary.

  • rajab natshah committed 4049345f on 1.0.x
    feat: #3615236 Add the header search box to the Varbase Starter header...
rajab natshah’s picture

Assigned: Unassigned » josebc
Status: Active » Needs review
rajab natshah’s picture

Assigned: josebc » mohammed j. razem
rajab natshah’s picture

Assigned: mohammed j. razem » Unassigned
Issue summary: View changes
Status: Needs review » Fixed

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

rajab natshah’s picture

rajab natshah’s picture

Issue tags: +varbase-11.0.0-rc1

✅ Released varbase-11.0.0-rc1

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.