Embeding谷歌日历的自定义日历颜色

我已经内嵌谷歌日历在我的网站上显示多个日历，但我希望有比默认选项其他颜色显示的日历。Embeding谷歌日历的自定义日历颜色

请求URL包含每个日历颜色参数，但似乎并没有接受非默认的颜色。（渲染的颜色也似乎并不相同，因为这些）

查看源;每个事件的颜色都由内联CSS定义，并且没有可用于通过CSS文件对其进行设置的类或ID属性。

我试过使用PHP来获取日历的HTML，然后使用字符串替换来改变颜色（基于this answer）其中的作品，但它不会改变颜色我使用的PHP文件：

<?php 

$content = file_get_contents('https://www.google.com/calendar/embed?showTitle=0&showPrint=0&showTabs=0&showTz=0&height=750&wkst=2&bgcolor=%23FFFFFF&src=1.keswickscouts.org_5d750s21fh55t45nsh4i49co5g%40group.calendar.google.com&color=%23691426&src=1.keswickscouts.org_k8ai784s6meu1eh71fk21etseg%40group.calendar.google.com&color=%23182C57&src=1.keswickscouts.org_4omjhqh48ud1lkigino18dmid0%40group.calendar.google.com&color=%232F6309&src=06illa48gj7en6896jv32cm93c%40group.calendar.google.com&color=%23125A12&src=1.keswickscouts.org_m6mb8idejtptmfkve9gm6latd8%40group.calendar.google.com&color=%236B3304&src=1.keswickscouts.org_5uaafulf65hrc4b64j3bfa6660%40group.calendar.google.com&color=%235229A3&src=1.keswickscouts.org_qudhcb0ii68u6b5mgs2ase200o%40group.calendar.google.com&color=%23B1365F&ctz=Europe%2FLondon'); 

$content = str_replace('</title>','</title><base href="https://www.google.com/calendar/" />',$content); 

$content = str_replace('B5515D','CC9966', $content); //ASU 
$content = str_replace('536CA6','099FF', $content); //Beavers 
$content = str_replace('7EC225','33CC00', $content); //Cubs 
$content = str_replace('125A12','006990', $content); //Eden 
$content = str_replace('194D14','999966', $content); //Explorers 
$content = str_replace('8C66D9','4D2177', $content); //Group 
$content = str_replace('E67399','006666', $content); //Scouts 

echo $content; 

?>

任何消耗？简单的将是更好

来源

2013-01-11 The-Keswickian

的PHP代码来这里http://keswickscouts.org/test-page产生日历 –

我可以用两个数组的只有一个str_replace函数建议你：

$search = array('B5515D', '536CA6', '7EC225'); 
$replace = array('CC9966', '099FF', '33CC00'); 

$content = str_replace($search, $replace, $content);

一个更复杂的建议是使用google calendar API。

来源

2013-01-11 16:00:48 magnetik

这是明显快（感谢），但可惜还是不能正常工作。 –

这是棘手的，因为谷歌日历使用动态连接到负载其元素与JavaScript因此没有被你发布潜在的解决方案来改变。

日历的唯一的HTML版本不具备的各种你正在寻找的颜色，这样就不能工作。

而且并发症出现，因为JavaScript的重建日历的身体当用户调整或几个月之间移动。所以，即使你的页面加载正确的着色，它可能不会保持你想要的方式。

一个解决方案是继续日历导入到本地网页，以避免跨站点的限制，然后把事情做好的页面加载和打击通过更改不断地检查，以保持他们的方式。我不知道如果有一个更有效的方法：

本地日历页：cal.php

<?php 
    $content=file_get_contents("https://www.google.com/calendar/embed?showTitle=0&showPrint=0&showTabs=0&showTz=0&height=750&wkst=2&bgcolor=%23FFFFFF&src=1.keswickscouts.org_5d750s21fh55t45nsh4i49co5g%40group.calendar.google.com&color=%23691426&src=1.keswickscouts.org_k8ai784s6meu1eh71fk21etseg%40group.calendar.google.com&color=%23182C57&src=1.keswickscouts.org_4omjhqh48ud1lkigino18dmid0%40group.calendar.google.com&color=%232F6309&src=06illa48gj7en6896jv32cm93c%40group.calendar.google.com&color=%23125A12&src=1.keswickscouts.org_m6mb8idejtptmfkve9gm6latd8%40group.calendar.google.com&color=%236B3304&src=1.keswickscouts.org_5uaafulf65hrc4b64j3bfa6660%40group.calendar.google.com&color=%235229A3&src=1.keswickscouts.org_qudhcb0ii68u6b5mgs2ase200o%40group.calendar.google.com&color=%23B1365F&ctz=Europe%2FLondon"); 
    $content = str_replace('</title>','</title><base href="https://www.google.com/calendar/" />',$content); 
    print $content; 
?>

日历显示页

<html> 
<head> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
    <script language='javascript'> 
    var oldhtml; 

    function swapcolors(oldcolor, newcolor){ 
     console.log("Searching for " + oldcolor); 
     $('iframe#gcal').contents().find('.rb-n').filter(
     function() { 
      console.log(this); 
      console.log($(this).css('background-color')); 
      console.log($(this).css('background-color')==oldcolor); 
      return $(this).css('background-color')==oldcolor; 
     } 
    ).css({'background-color': newcolor}); 
    } 

    function recolor(){ 
     swapcolors('rgb(83, 108, 166)', '#099FF'); //Beavers 
     swapcolors('rgb(126, 194, 37)', '#000000'); //Cubs 33CC00 
     swapcolors('rgb(181, 81, 93)', '#CC9966'); //ASU 
     swapcolors('rgb(18, 90, 18)', '#006990'); //Eden 
     swapcolors('rgb(25, 77, 20)', '#999966'); //Explorers 
     swapcolors('rgb(140, 102, 217)', '#4D2177'); //Group 
     swapcolors('rgb(230, 115, 153)', '#006666'); //Scouts 
    } 

    function keepcolored(){ 
     if($('iframe#gcal').contents()!=oldhtml){ 
     recolor(); 
     oldhtml=$('iframe#gcal').contents(); 
     } 
    } 

    $(document).ready(
     function() { 
     $('iframe#gcal').load(recolor); 
     oldhtml=$('iframe#gcal').contents(); 
     window.setInterval(keepcolored, 700); 
     } 
    ); 
    </script> 
</head> 
<body> 

    <iframe id="gcal" style="width:100%;height:100%" src="cal.php"> 
    </iframe> 
</body> 
</html>

注意find('.rb-n')可能需要返回之前它们进行调整和这样的背景颜色转换为RGB值（ALA rgb(230, 115, 153)）。

来源

2013-01-12 11:22:35 Richard

Embeding谷歌日历的自定义日历颜色

回答

相关问题