CSS, PHP | Type: CSSStyling Embedded Google Calendars

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

We use cookies in order to give you the best possible experience on our website. By continuing to use this site, you agree to our use of cookies.
Accept