Change breakpoint in Homestore and Storefront
(not advisable setup) You can run in a payed child theme (Homestore) for Storefront. Changing styling in the stylesheets can be a nightmare. In a situation where you only want to change the breakpoints this script can help you. For general supplements to the styling it is advised to create a plugin that adds an extra stylesheet.
This little script will:
- Copy stylesheets for themes that should not be edited
- If they have not been copied before change the breakpoints
If the themes are updated, the backups are gone and the breakpoints will be changed again.
add_action('admin_init', 'check_status_breakpoints'); function check_status_breakpoints() { $themePath = get_theme_root(); // settings - replace in theme $themesStyles = [ 'homestore' => [ 'replace' => 'max-width: 767px', 'with' => 'max-width: 990px' ], 'storefront' => [ 'replace' => 'min-width: 768px', 'with' => 'min-width: 991px' ] ]; // for settings foreach ($themesStyles as $theme => $themesStyle) { // theme files $themeStyleSheet = $themePath . '/' . $theme . '/' . 'style.css'; $themeStyleSheetBackup = $themePath . '/' . $theme . '/' . 'style.backup.css'; // if no backup => no replacement has taken place => backup and replace if (file_exists($themeStyleSheet) && !file_exists($themeStyleSheetBackup)) { // backup copy($themeStyleSheet, $themeStyleSheetBackup); // replace $styleSheet = file_get_contents($themeStyleSheet); $styleSheet = str_replace($themesStyle['replace'], $themesStyle['with'] ,$styleSheet); file_put_contents($themeStyleSheet, $styleSheet); } } }