This is a real rookie question. Apologies in advance.
I am looking to change the following blog page from 3 columns to 2 columns.
https://www.marriedin.co.uk/wedding-hacks
I have been viewing source in the inspector in Chrome. My thinking was that I could simply edit the following:
<div class="blog-archive blog-archive--grid" data-columns="2">
This may not work but this is what I planned to try. My problem is that I do not know which file this would be in when I access the site through an SFTP client. Is there any way to work this out from the inspector?
Thanks very much
Hey there may be a simple way in your Theme Options to change this to two columns but in case it isn't you could edit the template files. Your blog template is most likely under archive.php or index.php in your theme folder.. although you should have a look at here if you should have trouble locating the file to edit.
Somewhere in the blog template file these divs are being generated which you can see when you inspect your site.
<div class="col-md-4"> </div>
<div class="col-md-4"> </div>
<div class="col-md-4"> </div>
These are bootstrap elements that make 3 columns. Take a look here if you are not familiar with bootstrap.
To make it 2 columns like you want, change the "col-md-4" classes to "col-md-6".
That should do the trick, hope it helps.
Related
I work for a company and have taken over responsibility for maintaining the website. The company hired an outside agency to create its website. They used Wordpress and templates. I'm used to coding with things like Divi...I'm not 100% sure how to manipulate their work.
http://comfortcarehomehealth.com. We have a fly out on the right hand side that says "Contact". It used to house a form that wasn't directing correctly so I deleted the form. However, I have no idea how to delete this little "contact" piece. I've searched within the Wordpress theme customizer and attempted to find it in the editor but I don't really know what I'm looking for. I'm not a coder so...
How do I get rid of the "contact" fly out completely?
I can find it in the view source:
<div class="cover" data-img="https://comfortcarehomehealth.com/wp-content/uploads/2015/09/CC_Vol2_1440x620_HIRES1.jpg">
<div class="help">
<div class="container">
<a href="#" class="button-open">
<i></i>
<span>Contact</span>
</a>
<div class="form">
<div class="header">How can we help you?</div>
</div>
Any help is much appreciated!!
Problem
I have a customer that wishes to display the entire contents of a certain folder (containing images) on their search page, should the search return 0 results. The folder is located at mysite.com/images
Setup:
As a test environment I have setup a seperate site with the following structure:
ROOT
|-Folder1 <-- current directory I am viewing
| |-images
|-Other folders
I modified the folder_summar_view template, to include the following code (I decided to modify a view to see if I could hack that to pieces to make it do what I want):
<div tal:define="image context/images/getFolderContents">
<div tal:content="i" tal:repeat="i image" />
</div>
What I see:
<Products.ZCatalog.Catalog.mybrains object at 0x9d2ddb8>
Things I've tried and further explanations
I was under the assumption that when the context/images/getFolderContents returns a brain for the 'objects' in my images folder, I could then iterate through each 'object' using my tal:repeat statement below it. Then display them on my page.
If I just use the following code:
<div tal:content="context/images/getFolderContents" />
My output is very similar to the above 'What I see' section:
<Products.ZCatalog.Catalog.mybrains object at [...]>
where [...] is another number
I've been doing some research and reading the Plone Theming book, but my code is similar to their tal:repeat examples on page 169, it seems the only difference is they are not using this on a brain (as far as I can tell).
I tried this, although it produced the same results (not sure why I tought it wouldn't):
<div tal:define="image python:context.images.getFolderContents()">
<div tal:content="i" tal:repeat="i image" />
</div>
I don't seem to be able to 'get inside' the returned brain. Everything I've looked for online doesn't quite help that much, I've also trawled through the atct_album_view and folder_listings templates to know avail. - I think I'm overlooking or missing something.
The first link I stumbled across was this, however I have moved on since that as although similar, it's not quite what I was trying to do.
The Plone guys on their chat room were kind enough to give me the context/images/getFolderContents statement, I tried to press on without asking for help again but it seems I've hit a wall.
More stuff I've tried
Using this link as inspiration I decided to try the following:
<div tal:define="image context/images/getFolderContents">
<div tal:content="image/getURL" />
</div>
But that throws an error when I try to view the template. The error reads along the lines of the 'getFolderContents brain does not have the attribute getURL' - Although image/Title displays the name of the folder, but that's not really what I need.
I also found this link however because I am making use of the default search, I don't really want to have to edit python scripts as I fear it may adversely effect the normal Plone site search. Also in this link they seem to be making use of more Python scripts. - To expand on this point, I'm not sure on how these scripts 'link' with page templates (how they know to 'talk' to one another).
Conclusion
In conclusion I need to display all of the images contained within a folder named "images" located at the root of my site, I am unable to access the contents of a returned brain using getFolderContents. And other than displaying the title of the "images" folder or the brain identifcation (<Products.ZCatalog.Catalog.mybrains object at 0x9d2ddb8>) , I have had no luck. Any help or ideas welcomed!
As getFoldercontents returns a list of brains i cant see how your code can work.
Just repeat over it with something like that :
<tal:block tal:repeat="image context/images/getFolderContents">
<a tal:attributes="href image/getURL" tal:content="image/Title"/>
</tal:block>
I have installed a diazo theme for my Plone site. Now I need to change the default logo that is being used. In another question I was instructed to look at the rules.xml and index.html files that come in the theme's directory and to figure out how to change the logo by editing one of those files manually. However, I cannot figure out how to do this. These appear to be the relevant lines from my index.html file:
<div id="portal-header">
<div id="portal-slogan">
<span class="heightImmitator"></span><span>Free Theme for Plone</span>
</div>
<a id="portal-logo" title="Site1" href="/"><span class="heightImmitator"></span><img src="images/logoSchools.gif" alt="" title="" height="71" width="402"></a>
<div id="portal-personaltools-wrapper">
<h5 class="hiddenStructure">Personal tools</h5>
<dl class="actionMenu deactivated" id="portal-personaltools">
<dt id="anon-personalbar"><a style="cursor: pointer;" class="link-overlay" rel="#pb_1" href="/login" id="personaltools-login">Log in</a></dt>
</dl>
</div>
</div>
And these appear to be the relevant lines from my rules.xml file:
<copy css:theme="#portal-logo" css:content="#portal-logo" attributes="href"/>
<copy css:theme="#portal-logo" css:content="#portal-logo" attributes="title"/>
<replace css:content="#portal-logo img" css:theme="#portal-logo img" />
I guess that the "replace" line is telling the theme to replace one logo with another. However, it is not intuitive to me how I should edit these files to find the logo that I have uploaded. Incidentally, the image file that I have uploaded is called nav-home1.png and it is sitting in a directory called site-images which is in my home directory.
If I were you (and taking my comment about where to do this above into account), I'd simply remove the <replace /> rule that's trying to pull Plone's logo in from the content and then edit your index.html to reference your image file directly (at this point, it's all just plain HTML).
Incidentally, you may benefit from reading a bit more about the Diazo rules and what they do, on http://diazo.org/. For a heads-up (even if textual) of what the in-Plone experience will be in Plone 4.3, see http://pypi.python.org/pypi/plone.app.theming.
Martin
My solution was to place my image file in the ~/Plone/buildout-cache/eggs/quintagroup.theme.schools-6.0.10-py2.7.egg/quintagroup/theme/schools/static/images directory and then comment out the line in rules.xml that tells index.html to replace the image, and then edit index.html so that it loaded my image instead of logoSchools.gif, which was previously indicated. This did the trick, but now my problem is that the theme is getting the sizing information from somewhere else, so the image is far too big. Adjusting the height and width attributes in index.html have no effect.
I would suggest getting the static theme files provided by the theme egg. Then editing and packaging it as a zipped file (Use as guide -> http://pypi.python.org/pypi/plone.app.theming/1.0#packaging-themes). Then you can upload it from the Diazo control panel.
If you want to manipulate the zipped files within Plone, you can go to portal_resources in the ZMI and edit the files there. If you want to distribute the edited files, download it from the Diazo panel.
This is a bit of work for now, but the experience should dramatically change in Plone 4.3 as suggested by optilude.
For help in understanding Xpath, use: http://www.w3schools.com/xpath/default.asp Spend some time on the tutorials. It is really simple to understand.
I uploaded my logo image to the FS. I've got a develop-egg in {ZEOHOME}/src/
So, the image shows up like this:
/usr/local/Plone/zeocluster/src/quintagroup.theme.sunrain/quintagroup/theme/sunrain/static/images/theme_rain/PF-Sig.png
(See buildout tutorial for how to add a develop egg...)
In the theme's ..theme/sunrain/static/index.html file, use a direct reference like this:
<img src="/++theme++quintagroup.theme.sunrain/images/theme_rain/PF-Sig.png" alt="" title="PF Sig Logo" height="150" width="300"/>
The sizing info is right there in the <img.. /> tag.
However, it seems to be important, after making any changes, to go to Plone's Theme Control Panel, and deactivate/reactivate the theme, so that it will re-process the Rules.
I have spent the past six hours trying to change the logo in a fresh Plone 4.2 (OK, I'm a bit rusty!)
Quintagroup just tells me to customize logo.png in the ZMI, but that seems so... 2002 ;-) I spent hours yesterday trying to use the 4.3 theme-TTW feature, only to find that SunRain seems to break when I create a TTW copy.
Since this seems to be a top user request, why is it still so absurdly hard to figure out?
Should this not be a simple "Upload your new Logo Image" in the Themes Control Panel?
I am working on a new blog using wordpress and I came across a strange error. in my theme file there is no
<div id="sliderDiv">
<img src="images/sliderMain.png" width="1000" height="427">
</div>
in index.php or page.php I even look into search.php and searchpage.php but I already remove those lines from those files already but they show up all the time I could not figure out from where they are coming.those HTML lines were first used for testing purpose in all those files but I already removed them, but still showing up. I deleted them from theme editor but they are showing up. I don't know whats the problem. I also try clearing up my cache but no luck. please help
Use a find/replace function in a text editor to search all of your theme files for that html. Any text editor - OS X or Windows - will have such functions.
Or use grep if you have a command line.
I am working on an Ubercart installation on a Drupal site we are producing. Everything is going smoothly, but I am now trying to setup the order page template (uc_order module), so that the frontend developers can style it up.
The page is the one you view when you go to user/[UID]/order/[ORDER-ID].
I understand how to use hooks, preprocess, theming and template functions within Drupal, but currently I cannot see a way of changing any of the markup on the "order panes" that make up the page. It goes without saying that I don't want to touch any of the module's code.
So, one of the pages is the 'Bill To' address pane:
<div class="order-pane pos-left">
<div class="order-pane-title">Bill to: </div>
Name<br>
Address<br>
Town<br>
Postcode<br>
</div>
Essentially I would like to put a class in the div, so that it looks like this:
<div class="order-pane pos-left bill-to">...</div>
<div class="order-pane pos-left ship-to">...</div>
<div class="order-pane pos-left payment">...</div>
<div class="order-pane pos-left comments">...</div>
...
I just cannot see a way of doing this.
Any help would be much appreciated.
Have you checked the latest version of UC? The release note states:
The biggest change, though, is that order invoice templates now use the theme system to allow customizations. Instead of altering the module files directly, it is now correct to override them in the theme, just like node and page templates.
...and if I am not mistaken (a few months have passed by since I worked with UC), the invoice IS the page displayed by the URL you provided.
If my memory failed me (I haven't a UC installation handy to verify myself), a possible workaround (admittedly far from elegant, but still allowing you not to change the module's code) would be to alter the HTML with jQuery once the page has been loaded.
A more hack-ish workaround would be to maintain your own page callback for that URL, and just alter the menu definition in the UC code [yes, it's still hacking the code, but in this case you just need to modify one line in the UC code, and can maintain your code in a separate module].
HTH,
Mac.
You can create youre own panes or a single pane for everything, look up hook_pane, or you can insert the classes using jquery.