Last active
July 22, 2021 01:56
-
-
Save seedprod/5c83b962c1686be58839f7dc50f369a2 to your computer and use it in GitHub Desktop.
This will remove inline css and style tag and will allows you to move to dedicated style sheet or head.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| // https://simplehtmldom.sourceforge.io/ | |
| include_once('simple_html_dom.php'); | |
| function semi_it( $string ) { | |
| return rtrim( $string, ';' ) . ';'; | |
| } | |
| function generate_random_string($length = 10) { | |
| $characters = '0123456789abcdefghijklmnopqrstuvwxyz'; | |
| $charactersLength = strlen($characters); | |
| $randomString = ''; | |
| for ($i = 0; $i < $length; $i++) { | |
| $randomString .= $characters[rand(0, $charactersLength - 1)]; | |
| } | |
| return $randomString; | |
| } | |
| $css_inline = array(); | |
| $css_styles = array(); | |
| $html = <<<HTML | |
| <style>body{background:red}</style> | |
| <div id="sp-page" class="spBgcover sp-content-1" style="background-color: rgb(255, 255, 255); font-family: 'Helvetica Neue', Arial, sans-serif; font-weight: 400;"><section id="sp-ks8a8s" class="sp-el-section " style="width: 100%; max-width: 100%; padding: 10px;"><div id="sp-vw3kvy" class="sp-el-row sm:sp-flex sp-justify-between sp-w-full sp-m-auto" style="padding: 0px; width: auto; max-width: 1000px;"><div id="sp-ql6isr" class="sp-el-col sp-p-4 sp-w-full" style="width: calc(100% - 0px); padding: 10px;"><h1 id="sp-eyv0w5" class="sp-css-target sp-headline-block-eyv0w5" style="font-size: 36px; font-style: italic; font-family: Garamond, serif; line-height: 3; letter-spacing: 6px; color: rgb(67, 160, 71); text-shadow: rgba(0, 0, 0, 0.5) 1px 1px 0px; text-align: center; padding: 10px; margin-top: 0px;">My Awesome Headline</h1></div></div></section><section id="sp-dyypd6" class="sp-el-section " style="width: 100%; max-width: 100%; padding: 10px;"><div id="sp-ebhc98" class="sp-el-row sm:sp-flex sp-justify-between sp-w-full sp-m-auto" style="padding: 0px; width: auto; max-width: 1000px;"><div id="sp-z81vv7" class="sp-el-col sp-p-4 sp-w-full" style="width: calc(100% - 0px); padding: 10px;"><div id="sp-zqh921" class="sp-css-target sp-text-wrapper sp-text-wrapper-zqh921" style="padding: 50px; text-align: left; box-shadow: rgba(0, 0, 0, 0.5) 0px 1px 2px 0px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam commodo velit ex, non ultrices leo auctor at. Integer blandit ex velit, vel aliquam sem tempor eu. Pellentesque sem tortor, elementum et nisi sed, convallis pharetra lorem. Aenean rhoncus rhoncus ex, in dictum massa dictum et. Morbi at nisl fermentum, condimentum tortor a, laoreet leo. Curabitur laoreet diam a metus tincidunt, sed dapibus orci venenatis.</div><div class="sp-button-wrapper" style="padding: 10px; margin-top: 0px; text-align: center;"><a href="" id="sp-raggsr" target="" rel="noopener" class="sp-button sp-css-target sp-text-center sp-inline-block sp-leading-none sp-button-raggsr" style="font-size: 22px; background: linear-gradient(-180deg, rgb(67, 160, 71), rgb(56, 135, 60) 90%); color: rgb(255, 255, 255); width: auto; padding: 16px 20px; border-radius: 4px; border: 1px solid rgb(52, 124, 55); box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px inset;"><span>Call To Action</span></a></div></div></div></section></div> | |
| HTML; | |
| $phtml = str_get_html($html); | |
| // find all inline styles | |
| $inline_styles = $phtml->find('*[style]'); | |
| foreach($inline_styles as $k => $v){ | |
| // see if the inline style has an id, if not create one. | |
| if(empty($v->id)){ | |
| $v->id = 'sp-'.generate_random_string(); | |
| } | |
| // record id and styles and remove inline styles | |
| $css_inline[$v->id] = semi_it($v->style); | |
| $v->style = null; | |
| } | |
| // find all style tags | |
| $style_tags = $phtml->find('style'); | |
| foreach($style_tags as $k2 => $v2){ | |
| // find style tags and record | |
| $css_styles[] = $v2->innertext; | |
| // remove style tags | |
| $v2->outertext = ''; | |
| } | |
| ?> | |
| <html> | |
| <head> | |
| <?php | |
| echo '<style>'; | |
| foreach($css_styles as $k3 => $v3){ | |
| echo $v3; | |
| } | |
| foreach($css_inline as $k2 => $v2){ | |
| echo '#'.$k2.'{'.$v2.'}'; | |
| } | |
| echo '</style>'; | |
| ?> | |
| </head> | |
| <body> | |
| <?php echo $phtml; ?> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment