Closed kickTiger closed 1 year ago
What do you have in the daily.css
file? It is partially working for me.
The <%* app.commands.executeCommandById("obsidian-open-weather:replace-template-string")%> should not be required, I have to check the documentation on that.
The weather information below the image is produced from the %weather3%
you have right below the yaml which is probably not what you want..
Can you try using this css and let me know how it looks.
/*====================*/
/* Daily Note Styling */
/*====================*/
.daily {
padding-left: 25px !important;
padding-right: 25px !important;
padding-top: 20px !important;
}
/* Transition Effect Weather One */
.weather_current_1,
.weather_historical_1 {
transition: 0.3s;
}
/* Transition Effect Weather Two */
.weather_current_2,
.weather_historical_2 {
transition: 0.3s;
}
/* Transition Effect Weather Three */
.weather_current_3,
.weather_historical_3 {
transition: 0.3s;
}
/* Transition Effect Weather Four */
.weather_current_4,
.weather_historical_4 {
transition: 0.3s;
}
/* Historical & Current weather One, Two, Three and Four common settings */
.weather_historical_1, .weather_current_1, .weather_historical_2, .weather_current_2, .weather_historical_3, .weather_current_3, .weather_historical_4, .weather_current_4 {
display: flex;
float: left;
clear: left;
align-items: center;
top: 80px;
left: 35px;
position: absolute;
font-family: monospace;
font-size: 14pt !important;
margin: 10px 5px;
padding: 10px 20px;
border-radius: 20px;
box-shadow: 3px 3px 2px #414654;
cursor: pointer;
}
/* Historical weather at top of the document over banner */
.weather_historical_1, .weather_historical_2, .weather_historical_3, .weather_historical_4 {
color: #d0dce9;
background-color: #0d3d56;
}
/* Current weather at top of the document over banner */
.weather_current_1, .weather_current_2, .weather_current_3, .weather_current_4 {
color: #c4caa5;
background-color: #133e2c;
opacity: 0;
}
/* Show Current weather One on hover */
.weather_current_1:hover {
opacity: 1;
}
/* Show Current weather Two on hover */
.weather_current_2:hover {
opacity: 1;
}
/* Show Current weather Three on hover */
.weather_current_3:hover {
opacity: 1;
}
/* Show Current weather Four on hover */
.weather_current_4:hover {
opacity: 1;
}
/* Daily Note Name H6 Styling (YYYY-MM-DD) */
.daily h6 {
font-size: 1.75em;
color: #4cbf90;
border-width: 1px;
padding-bottom: 3px;
text-align: center;
}
/* Daily Note Date H5 Styling (๐น Thursday ๐น 10th November ๐น 2022 ๐น) */
.daily h5 {
font-size: 1.25em;
color: #23a49d;
border-width: 1px;
padding-bottom: 3px;
text-align: center;
}
/* Hide the frontmatter for Daily Notes */
.daily .frontmatter-container {
display: none;
}
The screenshot above shows the use of this CSS. The key point is the following two calls, which are not parsed in the template:
%weather3%
<div class="weather_historical_3">%weather3%</div>
I added 2 of %weather3%
just to test
Yes I see what you are saying now. Those both should be converted automatically. Try closing the tab and re-opening the file, one of the triggers to convert them is on file open. Also, do they convert if you run the command manually - Replace template strings
from the command palette or from the icon on the left sidebar?
I'm suspect that it may be another plugin that is interfering with this. I just tried your template in an empty vault with only the OpenWeather plugin installed and nothing else and it works just fine. If you have the time, can you try creating a new empty vault and install just the OpenWeather plugin (and Banners plugin) and add and activate the css file as well and see if it works in that vault.
Also, what OS are you running this on. I only have windows 10 to test this on although it should run fine on mac without issues.
One other thing, can you check the settings and see what the Exclude Folder
setting is set to. If your file is in that folder or any sub-folder below it the template strings will not be converted.
After researching for half an hour, I solved the problemใ
I created an empty vault and installed only three plugins: Banners, OpenWeather, and Templater.
Through testing and research, I discovered that static weather text can be effective. However, there is one important thing to note regarding the settings of the OpenWeather plugin and the Exclude Folder
.
Initially, I left the exclusion folder empty. However, after testing, I found that this caused issues not only with generating weather in static text but also with intermittent failures in dynamic text.
To avoid these problems, I recommend setting the Exclude Folder
to the template path
specified by the Templater plugin. This way, templates under the Templater plugin will not be automatically replaced, and static weather will be valid under Templater templates.
Thank you very much for your answer. The plugin is excellent, keep up the good work! I will continue to record vlogs in the near future to recommend this plugin.
Thanks for doing all these tests, it has been a huge help!
The line %* app.commands.executeCommandById("obsidian-open-weather:replace-template-string")%>
in my example document is a holdover from an earlier version which relied on the Templater plugin. I have since removed all dependency on Templater and it works fine without being installed now. I definitely will update the documentation to remove that.
When I added the exclude folder option I originally meant to set a default folder but somehow that slipped past me. That will be added in the next update. You can set a default template folder in the Obsidian core plugins as well as in the Templater plugin so I will have it first check one, then the other and use the setting it finds. If no setting is found I will popup a notice to inform the user to set one in the settings.
Thanks again for your assistance in testing this, it has been a great help to me, William.
I should have added the static weather according to the style in the example. Here are the steps I followed:
I used the syntax from EXAMPLE.md directly in my template, and I also tried calling
%weather1%
alone, but it didn't work.The displayed effect is as shown in the picture, and %weather3% was not recognized correctly.