Save a file as calendar.php:
$your_google_calendar="[YOUR_CALENDAR_EMBED_URL]"; $url= parse_url($your_google_calendar); $google_domain = $url['scheme'].'://'.$url['host'].dirname($url['path']).'/'; // Load and parse Google's raw calendar $dom = new DOMDocument; $dom->loadHTMLfile($your_google_calendar); // Create a link to a new CSS file called schedule.min.css $element = $dom->createElement('link'); $element->setAttribute('type', 'text/css'); $element->setAttribute('rel', 'stylesheet'); $element->setAttribute('href', '/css/schedule.min.css'); // Change Google's JS file to use absolute URLs $scripts = $dom->;getElementsByTagName('script'); foreach ($scripts as $script) { $js_src = $script->getAttribute('src'); if ($js_src) { $parsed_js = parse_url($js_src, PHP_URL_HOST); if (!$parsed_js) { $script->setAttribute('src', $google_domain . $js_src); } } } // Append this link at the end of the element $head = $dom->getElementsByTagName('head')->item(0); $head->appendChild($element); // Remove old stylesheet $oldcss = $dom->documentElement; $link = $oldcss->getElementsByTagName('link')->item(0); $head->removeChild($link); // Export the HTML echo $dom->saveHTML();
Change the YOUR_CALENDAR_EMBED_URL variable (line 1) to your calendar’s URL. Now, you can change the style of calendar from schedule.min.css file. After that, you can embed it to your web page like this (open and close iframe tags deleted to play nice with the editor here):
iframe style="border-width: 0;" src="/calendar.php" width="560" height="400" frameborder="0" scrolling="no"></iframe
Reference Links
https://codersgrave.com/integrating-styled-google-calendar-website/